Solved

Drag Drop a Copy in Jquery

Posted on 2009-07-15
2
1,474 Views
Last Modified: 2012-05-07
In this example:
http://jqueryui.com/demos/droppable/#photo-manager

How would I make a copy of the photos when drag starts?  I want to drag a clone of the original item, leaving the original item in its place.  I do not want the picture to be deleted when moved to the 'trash' in other words.
See http://jqueryui.com/demos/droppable/#photo-manager

Open in new window

0
Comment
Question by:JayZeeBoy
2 Comments
 
LVL 2

Accepted Solution

by:
SaWey earned 125 total points
ID: 24863240
You can use something like this:
// image deletion function
				var recycle_icon = '<a href="link/to/recycle/script/when/we/have/js/off" title="Recycle this image" class="ui-icon ui-icon-refresh">Recycle image</a>';
				function deleteImage($item) {
						var $list = $('ul',$trash).length ? $('ul',$trash) : $('<ul class="gallery ui-helper-reset"/>').appendTo($trash);
 
						$item.find('a.ui-icon-trash').remove();
						var copy = $item.append(recycle_icon).clone();
						copy.appendTo($list).fadeIn(function() {
							copy.animate({ width: '48px' }).find('img').animate({ height: '36px' });
						});
				}

Open in new window

0
 

Author Closing Comment

by:JayZeeBoy
ID: 31603922
Suhweeeet!  Perfect!  Thank you!
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Hi all! Recently there was EE question and the person wanted to have a multi-column textbox <div> selection, so as a first step to answer I provided a link but that was not complete with JavaScript selection, but had a good style sheet. So as a ques…
Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question