Plugins

The plugins site is currently in development.

We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.

Collidable Draggables


Adds collision detection to draggable objects.

Add "collide: 'block'" or "collide: 'flag'" when you create a draggable:

$(".box").draggable({collide: 'flag'});
or
$(".box").draggable({collide: 'block'});

In 'flag' mode overlapping objects receive new classes - 'ui-draggable-overlapping' for the object being dragged and 'ui-draggable-overlapped' for the other object. In 'block' mode objects are blocked from overlapping other objects by being snapped to the edge of the object they collided with.

This doesn't currently play well with constraints because they are applied before the drag event is propagated.

Downloads



0
Your rating: None