Simple draggables
drag me around
drag me too!
or me!
Revertable Draggables
I move back
I do it faster!
I do it instantly!
Cloned Draggables
I leave clone
So do I
Me too!
Snapping Draggables
I snap to 40px
I snap to [40, 0]
I snap to [0, 40]
Axis Draggables
I move around
I move only X
I move only Y
Ranged Draggables
Ranged by simple positions
I move 100px
I move 200px
I move [200, 100]
Range defined by another element
Relatively Positioned Draggable
Auto-Discovered Draggables
I move around
I move only X
I move only Y
Simple Droppable
Drag me
Drop here
or here
Overlapping Droppables
Those droppables will react only when overlapped with draggable (50% by default)
Drag me
X Only Overlap
Y Only Overlap
Both Overlap
Overlap Y 30%
Overlap X 70%
Selective Droppables
Selective by a css-rule
Drag me
Reds Only
Blues Only
Drag me
Reds Only
Blues Only
Selective by an elements list
First
First Only
Second Only
Second
First Only
Second Only
Automatically Discovered Droppables
First
Drop it here
not here