Jquery draggable and clone

Question

Hi guys,

var icon = $("<div style='width:100px;height:100px;border-style:solid;'>");
icon.draggable({
    containment: 'parent',
    axis: 'y',
    drag: function(e,ui) { }
});
icon.clone(true).appendTo($("body"));

After I have made a clone, icon dragging stopped working. Does anybody know, how to fix this?

Thanks

Answer 1

What exactly you wanna do? Do you really need to clone? You can use one of the draggable() options: helper, which clones the element as just as you drag. See it in action: http://jsfiddle.net/nZm5H/

If you need to clone this way you do, you have to make the clone to be draggable also: like this

Answer 2

The draggable functionality does not stop working.

However, when you hold your mouse over the clone and move it around, it is the original element that gets dragged.

Click here to see this behaviour: http://www.jsfiddle.net/bxH3Q/

To get around this, you have to make each clone draggable.