Mobile Drag And Drop Summary

The jQuery Mobile Drag And Drop project is a plugin provides drag-and-drop functionality that works on desktop browsers as well as touch-screen mobile devices.

Using a desktop browser, you can fully utilise the drag-and-drop. On a mobile browser, there is a fall-back tap-to-life and tap-to-drop behaviour.

Note: The 4th draggable item can only be placed in the second drop zone - this is an example that shows how each draggable item can be given different drop zones.

You can drop items here.

You can drop items here too.

Drag 1

Drag 2

Drag 3

Drag 4*

 

Please read the mobile drag and drop documentation for instructions on how to use the plugin.

Options

classmodifier
Used to apply class names to the elements created by the plugin. You only need to specify a class modifier if you have a name-clash.
targets
The jQuery selector of the element or elements that you can drop an item onto (otherwise known as "drop zones").
status
The jQuery selector for an element, into which the current status of dragging and dropping will be placed. This is handy for testing purposes!
selectedclass
The class to be applied to draggable items when they are picked up.
activeclass
The class to be applied to "drop zones" when a draggable item is picked up.