Ben's Sandbox
  • Projects
  • Tags

Mixing jQuery UI Draggable, Droppable, and Sortable Interaction Widgets


View Blog   View Source  
This demo investigates how to integrate the different jQuery UI interaction widgets (Draggable, Sortable, and Droppable) together so they work together and still leverage their built-in capabilities. The goal is to be able to hook into the callbacks and know where an item originated from and react accordingly. Additionally, visual cues (ie hovering) to assist the user with the interactions are added to experiment with different approaches.

Draggable
Item 4
Droppable
Empty
Sortable
Item 1
Item 2
Item 3

© Ben Olson 2012 with help from Jekyll Bootstrap and Twitter Bootstrap