Drag & Drop: Examples

The Drag & Drop Utility allows you to create a draggable interface efficiently, buffering you from browser-level abnormalities and enabling you to focus on the interesting logic surrounding your particular implementation.

• Basic Drag and Drop: This example demonstrates the basics of drag and drop.
• Drag and Drop Handles: This examples shows how to define drag handles.
• Drag and Drop with the Dragged Element on Top: Demonstrates how to use Drag & Drop's event API to force a dragged element to draw on top of the other drag-and-drop elements.
• Drag and Drop using a Proxy Element: Demonstrates the built-in proxy-drag feature of drag and drop.
• Using Drag and Drop to Reorder a List: Demonstrates how to use drag and drop to reorder a list.
• Drag and Drop Interaction Groups: Demonstrates how to use multiple drag-and-drop interaction groups.
• Drag and Drop - Custom Click Validator: Demonstrates one way to implement a draggable panel.
• Drag and Drop - Staying in a Region: Demonstrates one way to implement dragging elements in a Region.