10 awesome jQuery Drag and Drop plugins. Want to become an expert in drag and drop feature? Then look no further – these tutorials are for you! Most of these plugins are written in jQuery, and they are super easy to customize and implement in your own projects in a matter of minutes.

Update: There are 18 more drag and drop plugins here

1. jQuery Iviewer

jQuery.iviewer is a jQuery plugin used to load and view image in container with ability to zoom image and to drag it with mouse in container.

2. Dragscrollable

Scroll a large nested layer within a viewport using native scroll from the container. It does not require drag and drop functionality from UI and it is faster than UI dragging.

3. Nettuts Drag and Drop

In this tutorial, I’ll show you how to create a customizable interface with widgets. The finished product will be a sleek and unobtrusively coded iGoogle-like interface, which has plenty of potential applications.

4. EasyDrag jQuery Plugin

It’s very simple, first you call the easydrag() method as in the old version and then you call the setHandler() method passing to it the id of the element that will act as the handle. The handle MUST be a child element of the content that will be dragged.

5. How to create a Simple Drag and Drop with jQuery

Here is a quick tutorial to help you get up and running with jQuery drag and drop.

6. Drag & Drop with PHP & jQuery

The ability to drag and drop content on a page and have it save the order can make for a great user interface and is actually relatively easy to execute with a few lines of jQuery

7. Drag and Drop with Persistence using JQuery

In this tutorial, we will focus on how to create a similar drag and drop functionality to add users to a room.

8. A more elaborated jQuery Drag & Drop (with cloning)

Learn drag and drop with cloning using jQuery.

9. Drag and Drop Buttons

Learn how to create Drag and Drop type Buttons.

10. Inserting text with Drag n’ Drop

In this we will learn how to insert text with drag and drop using jQuery.

Tags: jquery drag n drop
Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

Free Guide:

How to Choose the Right Charting Library for Your Application

How do you make sure that the charting library you choose has everything you need? Sign up to receive this detailed guide from FusionCharts, which explores all the factors you need to consider before making the decision.

No Reader comments

Special Offer
Free course!

Git into it! Bonus course Introduction to Git is yours when you take up a free 14 day SitePoint Premium trial.