This course is out of date and does not reflect our standards or industry best practices. We now recommend you take the Complete Intro to Web Development, v3 course.

Check out a free preview of the full jQuery Plugins and jQuery UI course:
The "Droppable Plugins" Lesson is part of the full, jQuery Plugins and jQuery UI course featured in this preview video. Here's what you'd learn in this lesson:

“Droppable” is the counterpart to a “draggable” event and integral to building a “drag-and-drop” interface. Easily add visual feedback when you start to drag or hover over an object by using activeClass or hoverClass options. Set-up your droppable element where each draggable element can be limited to one, or allowed several scenarios. As with the “draggable” plugin, the “droppable” plugin can be enabled or disabled, setting limits on how often the event can be repeated. Additionally, use the “tolerance” command to set the sensitivity, or reactivity, you prefer for your drag-and-drop feature to display. Instead of disabling, the draggable element can be destroyed by using the “destroy” method. These are common functionalities among widgets. If you want to differentiate “click” from “drag,” you will need to declare a distance in pixels, to show where the “drag” action will begin.

Get Unlimited Access Now