Total Followers 132,503
Do you want to become drag and drop feature expert? Then look no further – this article is just for you! Mostly these plugins are written in jQuery, and they are super easy to customize and implement in your own projects very fast.
Why such plugins are so handy? You can give your visitors a lot more customization options, they can virtually personalize your website or tool to suit it better for their needs. And you must know – people love it, I love it myself!
Ready to drag and drop into this article?
It creates a superior Lightbox that allows for AJAX injection, SWF content, iFrame content, and utilizes the new CSS3 transform property to mimick a Flash enviroment, while completely avoiding Flash.
A simple and lightweight Drag and Drop system powered by jQuery UI and PHP that allows you to Drag and Drop whichever file you wish to download from the server.
The server will then zip the files and allow you to download them in only one zip instead of having to download multiple files.This is both a great bandwith saver for server and user alike, but also very easy and an aesthetic asset to your website.
AnimaDrag allows draggable items to be eased by jQuery animation, which UI draggables do not allow. This allows for a richer display of the transition between two locations, with full easing support.
CropZoom is a plugin that let you select an area of an image to crop, whit this you can zoom in or zoom out,drag and also rotate. this plugins needs ui.droppable, ui.resizable, ui.slider from JQuery UI. Some code was taken from jquery.svgdom.js Written by Keith Wood.
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.
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.
Drag image into DIV area.
Build a file sharing or image hosting business with this user friendly interface or integrate it easily to enrich your existing site.
A file upload application, with the added benefit of the drag and drop functionality. Allows users to quickly and easily upload multiple files to your server by dragging & dropping them into the drop box or select files via the traditional uploader pop up, and have on-going access to them for download/sharing/modification/removal. Each upload boasts a full complement of sharing icons so files can be easily distributed to an unlimited audience at the click of a button.
A lightweight jQuery plugin that provides the ability to sort lists using drag and drop.
Drag n Drop panels are great to let the user control how he/she wants to see the information as he can arrange various information blocks according to his preference. This type of functionality is often provided by web portals or personal homepage services like iGoogle.
A jquery special event plugin that makes the task of adding complex drag interactions, to any element, simple and powerful.
Drag picture to share it on your favorite social network!
The jQuery mapbox() plugin is for creating relatively small scale, zoomable, draggable maps with multiple layers of content. This framework could be applied to games, development plans, or any layout that could benefit from being able to zoom in and pan to get a better view.
Interface is a collection of rich interface components which utilizes the lightweight JavaScript library jQuery. With this components you can build rich client web applications and interfaces with the same simplicity as writing JavaScript with jQuery.
jqDnR is a lightweight plugin for jQuery that lets you drag, drop, and resize elements.
This TableDnD plugin allows the user to reorder rows within a table, for example if they represent an ordered list (tasks by priority for example). Individual rows can be marked as non-draggable and/or non-droppable (so other rows can’t be dropped onto them). Rows can have as many cells as necessary and the cells can contain form elements.
This is a useful plug in to build full featured and fully skinnable containers. The container can be set to draggable, resizable, collapsable and minimizable.
Reel is a jQuery plugin which takes an image tag and makes it a live “projection” of pre-built animation frames sequence. Its aim is to provide a 360° view of something or someplace. Great alternative to widely used Flash and Java techniques.
The jQuery multiple draggable plugin is an extension to the jQuery UI Draggable plugin. This plugin extends the current functionality to allow for elements to be grouped and dragged as a group. The aim of the plugin is to include all of the current functionality listed in the options.
To group and ungroup elements simply control click, the ui-multidraggable extension is applied for styling purposes and also to alert the plugin as to which elements are grouped.
Resize rectangle with content in ways you want to.
Get The Only Freelancer crash course you will ever need to read!
Valters is 17 years old freelancer from Latvia. His experience in web-building is about 3 years - PHP, xHTML, CSS. He enjoys web-building with different languages. You can follow him on Twitter.
Sunday, April 1st, 2012 05:35
I have used draggable and droppable in my project but I am not satisfied with what I wanted to achieve so I have created new demo using simple mouse down, up and mouse enter event.
I hope this will help others.
Tuesday, March 20th, 2012 19:02
perfect
Wednesday, February 15th, 2012 12:31
very nice example
i m going to use it anyhow!
Thnaks
Friday, February 10th, 2012 22:27
great designing
it is my question too
“Could you make an article about how to use drag and drop Jquery to implement in WordPress theme?”
thanks for sharing
Monday, October 17th, 2011 12:49
Thanks ! The content on this article is very helpful. I really like the plug in for sitemap creation.
But i could not found any help for drag then drop then sort for dropped item. I want to drop a paragraph in droppable div then further wants to sort between multiple dropped items !
I will be very thankful in advance :)
Wednesday, October 5th, 2011 23:03
Hi!
How can I use together 14. Drag To Share and 27. jQuery UI multiple draggable plugin??
Thanks
Wednesday, September 28th, 2011 20:13
I really like the Drag ‘n Drop one it shows me that its possible to do what I have in mine for my project.
Tuesday, August 23rd, 2011 20:26
These are great examples! I too am particularly interested in the Nettuts one – 14th point above.. [and am a complete newbie!] question is can that be implemented on any link / any website ? or we need to have objects where we specifically have to specify earlier that this is ‘draggable’ Just like ReadItLater, where we can save to read later, I want to see if I can implement it for myself where I can drag and drop to read it later ?
Thanks vm
Tuesday, July 5th, 2011 08:56
I am working with “Nettuts drag and drop” demo. This demo is working excelent in all the browser except IE9. please can u provide me any solution so that i can also run it in IE9
Friday, June 3rd, 2011 21:12
Great article, I was looking into some easy drag and drop snippets. I like the one with the sitemap, as it is very similar to what i have to implement.
Thursday, March 3rd, 2011 11:29
appreciatable. Thanks all for my start up.
Wednesday, December 1st, 2010 04:43
Hi. very gud article which has so many plug-ins. but is there a particular plug-in tat allows movement of table cells within the same row? e.g: [1,2,3]. when [3] is moved to the front then the row should be [3,1,2], which means the other cells will be moved to the left when it is moved.
currently i found a library which uses javascript to implement. but the prob is tat when the row is [1,2,3] n i move [3] to first, the result is [3,2,1]. which means it switches places. i tried to manipulate the javascript file but its just too complicated to ammend.
so if there is any plug-in in jQuery it would be really helpfull. thanks
Sunday, October 10th, 2010 20:13
many good examples, but I think the best way to implement the various interesting features is to add them to the plugin jQuery UI
I had less difficulty to add functionality to my site via this way is
Thursday, September 9th, 2010 01:43
Very nice article and good collection of sites. I am implementing drag and drop for sorting elements using PHP & AJAX for my freelance portfolio website. Cheers.
Tuesday, July 13th, 2010 22:38
Interface has been discontinued for years! Is this list just the result of a “jquery drag drop” Google search?
Monday, July 12th, 2010 04:53
I really like the example of drag and drop with php and jquery. Thanks for the round up
Monday, July 12th, 2010 06:31
hello, see to my D&D jQuery UI application for wp captcha. [link href="http://cane.0fees.net/trampcha/"]trampcha[/link]
Friday, July 9th, 2010 03:33
Could you make an article about how to use drag and drop Jquery to implement in WordPress theme?
Get The Only Freelancer crash course you will ever need!
If not, then it's time to learn how to:
You can trust 1stWebDesigner to help you become a better web designer!
- Jacob Cass | Just Creative
Just enter your name and email below and click Get Updates!
Jennifer R
Friday, July 9th, 2010 03:33
Could you make an article about how to use drag and drop Jquery to implement in WordPress theme?
Mohan
Wednesday, December 1st, 2010 04:43
Hi. very gud article which has so many plug-ins. but is there a particular plug-in tat allows movement of table cells within the same row? e.g: [1,2,3]. when [3] is moved to the front then the row should be [3,1,2], which means the other cells will be moved to the left when it is moved.
currently i found a library which uses javascript to implement. but the prob is tat when the row is [1,2,3] n i move [3] to first, the result is [3,2,1]. which means it switches places. i tried to manipulate the javascript file but its just too complicated to ammend.
so if there is any plug-in in jQuery it would be really helpfull. thanks
suji
Thursday, March 3rd, 2011 11:29
appreciatable. Thanks all for my start up.
Chan
Sunday, October 10th, 2010 20:13
many good examples, but I think the best way to implement the various interesting features is to add them to the plugin jQuery UI
I had less difficulty to add functionality to my site via this way is
Kavyansh
Thursday, September 9th, 2010 01:43
Very nice article and good collection of sites. I am implementing drag and drop for sorting elements using PHP & AJAX for my freelance portfolio website. Cheers.
cane
Monday, July 12th, 2010 06:31
hello, see to my D&D jQuery UI application for wp captcha. [link href="http://cane.0fees.net/trampcha/"]trampcha[/link]
Mike
Monday, July 12th, 2010 04:53
I really like the example of drag and drop with php and jquery. Thanks for the round up
Sean O
Tuesday, July 13th, 2010 22:38
Interface has been discontinued for years! Is this list just the result of a “jquery drag drop” Google search?
yasir
Tuesday, July 5th, 2011 08:56
I am working with “Nettuts drag and drop” demo. This demo is working excelent in all the browser except IE9. please can u provide me any solution so that i can also run it in IE9
Vlad
Tuesday, August 23rd, 2011 20:26
These are great examples! I too am particularly interested in the Nettuts one – 14th point above.. [and am a complete newbie!] question is can that be implemented on any link / any website ? or we need to have objects where we specifically have to specify earlier that this is ‘draggable’ Just like ReadItLater, where we can save to read later, I want to see if I can implement it for myself where I can drag and drop to read it later ?
Thanks vm
sm
Tuesday, March 20th, 2012 19:02
perfect
Hitesh
Sunday, April 1st, 2012 05:35
I have used draggable and droppable in my project but I am not satisfied with what I wanted to achieve so I have created new demo using simple mouse down, up and mouse enter event.
I hope this will help others.
dhanesh mane
Tuesday, April 10th, 2012 04:05
thanks a lot for sharing, really very nice.
fakhru
Wednesday, February 15th, 2012 12:31
very nice example
i m going to use it anyhow!
Thnaks
JohnE
Wednesday, September 28th, 2011 20:13
I really like the Drag ‘n Drop one it shows me that its possible to do what I have in mine for my project.
Hamed
Friday, February 10th, 2012 22:27
great designing
it is my question too
“Could you make an article about how to use drag and drop Jquery to implement in WordPress theme?”
thanks for sharing
Jose Servin
Wednesday, October 5th, 2011 23:03
Hi!
How can I use together 14. Drag To Share and 27. jQuery UI multiple draggable plugin??
Thanks
Usman
Monday, October 17th, 2011 12:49
Thanks ! The content on this article is very helpful. I really like the plug in for sitemap creation.
But i could not found any help for drag then drop then sort for dropped item. I want to drop a paragraph in droppable div then further wants to sort between multiple dropped items !
I will be very thankful in advance :)
Pablinho
Friday, June 3rd, 2011 21:12
Great article, I was looking into some easy drag and drop snippets. I like the one with the sitemap, as it is very similar to what i have to implement.