jquery에서 이벤트 dragstart가 실행될 때의 재배치 요소

Question

dragstart 이벤트가 발생하면 항목의 위치를 ​​변경하려고합니다.

항목을 드래그하기 전에 화면에서 마우스의 현재 위치에서 이동해야합니다.

dragstart 직전에 발생하는 mousedown 이벤트에서의 재배치 옵션은 내가 찾고있는 것에 유용하지 않습니다.

나는이 방법으로 노력하고있어 사전에

var xMouse = 0; 
var yMouse = 0; 

$(document).mousemove(function(e){ 
    xMouse = e.pageX; 
    yMouse = e.pageY; 
}); 

$("#obj").draggable({ 
    revert: false, 
    start: function() { 
     $("#obj").css("left", xMouse+"px"); 
     $("#obj").css("top", yMouse+"px");  
    } 
}); 

$("#obj") 
.bind('dragstart',function(event){ 
    $("#obj").css("left", xMouse+"px"); 
    $("#obj").css("top", yMouse+"px");      
}) 
.bind('drag',function(event){ 

}) 

감사합니다.

Answer 1

문제는 jQuery UI의 "드래그"는 절대 위치 지정을 사용하여 노드를 이동시키기 때문에 드래그 시작에서의 수동 위치 지정이 완전히 덮어 쓰여집니다. 즉, 드래그 된 노드에 마우스 커서를 위치시키기 위해 cursorAtoption을 사용할 수 말했다 : 여기

$("#obj").draggable({ 
    revert: false, 
    cursorAt: { left: 0, top: 0 } 
}); 

는 그것을 위해 jsFiddle입니다.