10 Easy jQuery Drag and Drop Plugins

By Sam Deering

This post gives you 10 jQuery Drag and Drop Plugins (you may have not used before) that will give the poser to add Drag N’ Drop capabilities to your frontend. Take note though that some may still be beta/development or not fully maintained by the authors. Enjoy!

Related Posts:

Update 19/05/2013: Found a cool drag/drop/filter plugin called jQuery.Shapeshift.

1. Drag n Drop Scattered Gallery

Drag and drop gallery script with various look and feel options.

Drag n Drop Scattered Gallery


2. (mb)ImgNavigator

A photogallery for viewing very large images using a navigator map and drag. You can drag your large image in the display by the navigator or the image itself.



3. jQuery List DragSort

A lightweight jQuery plugin that provides the ability to sort lists using drag and drop.

jQuery List DragSort

Source + Demo

4. Ajax Upload; A file upload script with progress-bar, drag-and-drop

This plugin uses XHR for uploading multiple files with progress-bar.

Ajax Upload

Source + Demo

5. Drop n’ Save – Drag & Drop Uploader

This unique drop and save application allows you to add this facility to your website, today and with minimum hassle.

Drop n’ Save


6. (mb)ConteinersPlus

This is a useful plug in to build full featured and fully skinnable containers. The container can be set to draggable, resizable, collapsible and minimizable



7. jQuery Drag Expose | Draggable Image Gallery

Show your photos in a different way – Let the user drag & drop them to slide the gallery!

jQuery Drag Expose


8. Dynamic Drag’n Drop With jQuery And PHP

Drag’n drop generally looks hard-to-apply but it is definitely not by using JavaScript frameworks. Here is, how it is done by using jQuery & jQuery UI

Dynamic Drag’n Drop


9. Collidable Draggables

Adds collision detection to draggable objects.

Collidable Draggables

Source + Demo

10. NestedSortable

Is an extension to the original Sortable from the Interface plugin that allows you to both sort vertically and nest (make one item a child of other item) elements at the same time, using drag-and-drop.



Free Guide:

7 Habits of Successful CTOs

"What makes a great CTO?" Engineering skills? Business savvy? An innate tendency to channel a mythical creature (ahem, unicorn)? All of the above? Discover the top traits of the most successful CTOs in this free guide.

  • Thao

    Very helpful, I found a good solution through this post.

  • sdsdsd


  • Coders Helpdesk

    Great Collections Thanks for sharing..

  • Saul

    Thanks man so helpful!!!

Because We Like You
Free Ebooks!

Grab SitePoint's top 10 web dev and design ebooks, completely free!

Get the latest in JavaScript, once a week, for free.