All three squares can be dragged, and are drop targets
Always on top:
Same as the drag test, except the object being dragged is
displayed on top of the others.
The actual element is not moved during a drag operation.
Instead, an absolutely positioned div (created once for all instances) is resized to the dimensions
of the linked element and moved to the location of the drag operation.
When a list item is dragged past the center
of another list item, it is inserted before that item.
The items in the first two columns can interact with items in the other
column. The items in the third column are defined as a separate group,
so they can only interact with other items in the third column.
Multiple drag handles:
Shows how you can create multiple "hot spots" on your draggable item.
Demonstrates how multiple interaction groups and the events exposed
by the utility can be used to provide user feedback during the drag.
Demonstrates the graduated movement feature of drag and drop.
Demonstrates one approach to creating a draggable and resizable module.
Custom Click Validator:
In this example, we override clickValidator to provide custom logic for
determining if the initial mousedown should initiate a drag. A drag is
initiated only if the mousedown happens inside of the circle.