jQuery UI 드래그 가능 도우미 문제?

Question

왼쪽에 사진이 많아 오른쪽에있는 슬롯으로 끌어오고 싶지만 오른쪽의 슬롯으로 이미지를 끌면 왼쪽에있는 이미지가 사라집니다.

draggable 함수에 helper: 'clone'을 추가했지만 여전히 제거 중입니다. ui.draggable.css 위치 지정을 사용하여 슬롯의 드래그 된 요소 ontop을 배치합니다. 나는 그것이 문제일지도 모른다라고 생각한다. 그러나 나는 그것을 고치는 법에 관해서 확실하지 않다?

개체를 드래그하기 전에 개체를 복제 한 다음 드래그 한 항목 스냅을 삭제할 수있는 위치에 넣을 수 있습니까? .css을 사용하지 않고 수동으로 슬롯의 드래그 가능한 항목을 이동할 수 있습니다.

Answer 1

물어 보는 것을 달성하는 가장 쉬운 방법은 물방울이있는 클래스와 결합하는 것입니다. 여기에 내가 언급하고있는 무슨의 아주 기본적인 아이디어는 다음과 같습니다

<img class="draggable" src="http://jsfiddle.net/img/keys.png"> 
<img class="draggable" src="http://jsfiddle.net/img/logo.png"> 
<img class="draggable" src="http://jsfiddle.net/img/info-close.png"> 

<div id="dropzone" class="dropzone" style=""></div> 


$(function() { 
    $(".draggable").draggable({ 
     helper: "clone", 
     grid: [ 20,20 ] 
    }); 
    $("#dropzone").droppable({ 
     drop: function(event, ui) { 
      $this.append(ui.draggable); 
     } 
    }); 
}); 

은 나뿐만 아니라 당신을 위해 jsfiddle (http://jsfiddle.net/fordlover49/deb9W/)를 추가했다.