jQuery UI Interaction : Droppable
jQuery UI Interaction : Droppable
Using jQuery droppable plug-in , you can make selected elements droppable (meaning they accept being dropped on by draggables).
All callbacks receive two arguments: The original browser event and a prepared ui object, view below for a documentation of this object (if you name your second argument 'ui'):
- ui.draggable - current draggable element, a jQuery object.
- ui.helper - current draggable helper, a jQuery object
- ui.position - current position of the draggable helper { top: , left: }
- ui.offset - current absolute position of the draggable helper { top: , left: }
For options, events and method click here
Example :
droppable.html
<!DOCTYPE html> |
Output :
When you drop small box on big one , it will show a alert message :
Learn from experts! Attend jQuery Training classes.