將可拖動的圖像追加到特定的div

Question

我正在使用jQuery和jQuery UI來拖動和縮放圖像。 此外我需要將這個圖像追加到目標股利。

我的代碼：

<div id="decorations"> 

<div style="float:left; margin-left:5px; margin-top:5px;"> 
<img class="dragger" id="obj1" style="cursor: -webkit-grab;" src="objects/bike.png" width="80" height="80"> 
</div> 

<div style="float:left; margin-left:5px; margin-top:5px;"> 
<img class="dragger" id="obj2" style="cursor: -webkit-grab;" src="objects/car.png" width="80" height="80"> 
</div> 

</div> 

我想，當我離開它的格婁追加拖動圖像：

<div id="contentHolder"></div> 

代碼：

<script> 
$(document).ready(function() { 
window.zindex = 999; 
    $(".dragger").resizable({handles: 'ne, se, sw, nw'}); 
    $(".dragger").parent().draggable({ 
    $(".dragger").appendTo("#contentHolder"); //Tried this one without luck 
    }); 
}); 
</script> 

此外，我試過這個：

<script> 
$(document).ready(function() { 
window.zindex = 999; 
    $(".dragger").resizable({handles: 'ne, se, sw, nw'}); 
    $(".dragger").parent().draggable({  
    accept: '.dragger', 
     drop: function (event, ui) { 
      $('#contentHolder').append(ui.draggable); 
     } 
    }); 
}); 
</script> 

非常感謝！

Answer 1

充分利用contenHolder可放開：

$(".contenHolder").droppable({  
    drop: function(event, ui) {   
     //do something here 
    }  

});