YUI Library Home

Site Search (YDN & YUIBlog):

# YUI Library Examples: Drag & Drop

# 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.
- Using Handles: This examples shows how to define drag handles.
- 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.
- Using a Proxy Element: Demonstrates the built-in proxy-drag feature of drag and drop.
- Reordering a List: Demonstrates how to use drag and drop to reorder a list.
- Using Interaction Groups: Demonstrates how to use multiple drag-and-drop interaction groups.
- Custom Click Validator: Demonstrates one way to implement a draggable panel.
- Staying in a Region: Demonstrates one way to implement dragging elements in a Region.
- Using the Drag Shim: This example shows the use of the drag shim when dragging nodes over other troublesome nodes.

## Other YUI Examples That Make Use of the Drag & Drop

- Reorder Rows with Drag and Drop (included with examples for the DataTable Control)

### Drag & Drop:

- User's Guide (external)
- API Documentation
- Cheat Sheet PDF(external)

Copyright © 2010 Yahoo! Inc. All rights reserved.

Privacy Policy - Terms of Service - Copyright Policy - Job Openings