Droppable object : UI Droppable « jQuery « JavaScript DHTML






  1. JavaScript DHTML
  2. jQuery
  3. UI Droppable

Droppable object

 <html lang="en"> <head> <title></title> <link type="text/css" href="js/themes/base/ui.all.css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript" src="js/ui/ui.core.js"></script> <script type="text/javascript" src="js/ui/ui.draggable.js"></script> <script type="text/javascript" src="js/ui/ui.droppable.js"></script> <link type="text/css" href="js/demos.css" rel="stylesheet" /> <script type="text/javascript"> $(function() { $("#drag").draggable(); $("#target").droppable(); }); </script> </head> <body> <div id="drag">drag</div> <div id="target">target</div> </body> </html>








Related examples in the same category

1.jQuery UI Droppable - Accept Demo
2.jQuery UI Droppable - Simple photo manager
3.jQuery UI Droppable - Prevent propagation
4.jQuery UI Droppable - Revert draggable position
5.jQuery UI Droppable - Visual feedback
6.Get relative and absolute position of the dropped object
7.Mark accepted object
8.Mark active class
9.Droppable accepted function
10.Drag and drop events: activate, deactivate, drop, out, over
11.Drop to different objects and get their id
close