Javascript가 마우스 위치에서 드래그합니까?

Question

사용자가 iOS에서 화면 주위로 div를 드래그 할 수있게 해주는 스크립트가 있는데, 지금처럼 div를 드래그하면 드래그 가능한 지점이 가운데가됩니다. 사용자가 터치 할 때마다이 지점을 만들 수 있습니까?

코드는 다음과 같습니다

xPos = drag.offsetWidth/2; 
    yPos = drag.offsetHeight/2; 
    drag.addEventListener("touchmove", function() { 
     event.preventDefault(); 
     $(this).css({ 
      "left" : event.targetTouches[0].pageX - xPos + "px", 
      "top" : event.targetTouches[0].pageY - yPos + "px", 
      "z-index" : "1000" 
     }); 
     $("div").not(this).css("z-index", "1"); 
     $("div[id]").each(function() { 
      var id = $(this).attr("id"); 
      localStorage.setItem(id + "-z","1"); 
     });  
    }); 

어쨌든이 있도록 내가 할 수있는 그러나 멀리 사용자의 손가락이 떨어져 상자의 가장자리로부터 오프셋?

---

가 나는 작동 할 수 있습니다 다음 있지만하지 않는 것, 그것은 않습니다 모두가 원인 지터입니다 생각 :

$(this).css({ 
"left" : event.targetTouches[0].pageX - parseInt($(this).css("left"), 10) + "px", 
"top" : event.targetTouches[0].pageY - parseInt($(this).css("top"), 10) + "px", 
}); 

Answer 1

이 그것을 알아 냈다. 테스트 후, 다음은 부모의 왼쪽 또는 위쪽에서 픽셀 수를 생성했습니다.

event.targetTouches[0].pageX - $(this).offset().left 

트릭

빼기 하였다 손가락이 화면 가장자리 내지 화소 수 인 FROM event.targetTouches[0].pageX 즉.

그래서, 완성 된 코드는 다음과 같습니다

drag.addEventListener("touchstart", function() { 
    left = event.targetTouches[0].pageX - $(this).offset().left; 
    top = event.targetTouches[0].pageY - $(this).offset().top; 
}); 
drag.addEventListener("touchmove", function() { 
    $(this).css({ 
     "left" : event.targetTouches[0].pageX - left + "px", 
     "top" : event.targetTouches[0].pageY - top + "px", 
    }); 
});