jQuery UI 정렬 및 컨테이너 zoom

Question

확대/축소가 0.4 인 컨테이너 내에서 div를 정렬하려고합니다.

문제는 요소를 드래그하여 정렬 할 때 드래그 한 div의 위치가 마우스 커서와 관련이 없다는 것입니다. 컨테이너가 줌을하지 못하는 것처럼 div에 대해 커서를 기준으로 이동할 수있는 방법은 무엇입니까?

Heres a demo. 단순히 요소를 드래그하면 div가 커서에 따라 무비가 표시되지 않습니다. http://codepen.io/anon/pen/CFfxb

#container { 
    width: 1000px; 
    height: auto; 
    background-color:red; 
    margin: 0 auto; 
    zoom: 0.4; 
} 

Answer 1

직접 위치를 업데이트하십시오.

당신은 CSS가있는 경우 :

#container{ 
    zoom: 0.5; 
} 

당신이 사용하는 것을 :

$('#container').sortable(
    drag: function(e,ui){ 
     zoomAmount = 2; 
     ui.position.top = (e.clientY + $("body").scrollTop()) * zoomAmount; 
     ui.position.left = e.clientX * zoomAmount; 
    } 
); 

당신은 당신이 사용하고있는 줌 배율에 맞게 zoomAmount 변수를 업데이트해야합니다.

정도 :

zoomAmount = 2.2;