jQuery的鼠標在DIV位置

Question

我試圖讓jQuery的一個插件draggabble和它看起來像：

(function($){ 
$.fn.drag = function(){ 

    var element = this; 

    $(element).mousedown(function(){ 

     $(window).bind("mousemove",function(e){ 
      $(element).css({"position" : "absolute"}); 
      $(window).css({"-webkit-user-select": "none"}); 

      var pos = $(element).position(); 


      $(element).css({"left" : e.pageX+"px"}); 
     }); 
    }); 
}; 
})(jQuery); 

但是當鼠標移動（）發生在div位置，光標在其左側頂部角。它的工作原理，但只能從div的左上角。所以我的問題是如何編碼CSS，所以當我按下鼠標的按鈕，並開始移動光標在屏幕上，拖動只發生在被採取的立場。 jQuery UI做到了這一點，但我無法在他們的代碼中找到它。希望你明白這一點。提前致謝！

Answer 1

從這個jQuery tutorial你只需要使用關於當前元素的元素偏移量。

var x = e.pageX - this.offsetLeft; 

，比你css()

$(element).css({ 
      "left": (e.pageX - x) + "px" 
      }); 

上jsfiddle代碼示例。

Answer 2

您將不得不根據遊標在元素中的位置來抵消它。