5 Best JQuery drag and drop plug-ins

Exploring the world of User Interfaces and new designs now has become a trend among website designers. After all, it brings better plans and hence these designers can create special effects and make a website look even more special.

Drag and Drop feature is almost an inevitable part of any website. With a touch of jquery, even drag and drop can be made special. Here are 5 of the best useful and cool jquery plug-ins available for drag and drop feature:

A Draggable mimicry – ppDrag

Jquery plug-in itself has a UI supporting drag and drop facility and that is known as Draggable. The ppDrag plug-in is quite similar in nature with Draggable. It enhances overall performance of a website. If you are using a slower CPU, the change of load time of your website is very much noticeable. Also, in latest browsers JavaScript optimization has been done, hence you will clearly see the speed difference once you run the same website in an old browser and then in a new one.

NestedSortable – Extension to sortable

This plug-in is nothing but an extension to the previously available sortable plug-in. Here in NestedSortable, you can actually make the whole drag and drop feature kind of nested. For an example, you can sort the items vertically and make one item the child of another. It can be used very effectively to organize a table of contents, organize the categories and organize a list of hierarchy pages.

JQuery UI multiple draggable plugin

This particular plug-in is an extension to the jQuery UI Draggable plugin. With help of this plug-in, the items can be grouped and then a user can drag them as a single group as well. This plug-in hence provides better functionality to a website and makes it user-friendly.

For controlling the elements for grouping and for ungrouping, you just need to make a click from your mouse. You can also adjust the skins to make it look quite stylish.

JQuery List DragSort

As the name suggests, this plug-in can sort the items to be dragged based on a criteria. The plug-in is pretty lightweight in nature and hence does not put any extra loan on the website. You have plenty of options that you can use in this plug-in. You can enable dragging between already selected lists, can call a function when the drag and drop is complete, can change the speed of scrolling. The scroll container can also be customized as well and you don’t need to be a web designer to do that.

Collidable Draggables

It adds collision detection functionality to the objects that are dragged. You have two options to choose from. You can either allow overriding of a previously dragged item by another or you can show a message prohibiting to do so. However, it may not be easy to use for a person who does not have that much of sound knowledge regarding JavaScript, hence if seen from the usability point of view, it losses points.