jQuery鼠标在div位置答案

【问题标题】：jQuery mouse in div positionjQuery鼠标在div位置
【发布时间】：2011-03-26 16:46:36
【问题描述】：

我正在尝试为 jquery 制作一个可拖动的插件，它看起来像：

(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);

但是当 mousemove() 发生时，div 会进入光标位于左上角的位置。它可以工作，但只能从 div 的左上角开始。所以我的问题是如何编写 css 代码，所以当我按下鼠标按钮并开始在屏幕上移动光标时，拖动只会发生在被占用的位置。 jQuery UI 做到了，但我在他们的代码中找不到它。希望你明白这一点。提前致谢！

【问题讨论】：

标签： jquery cursor mouse

【解决方案1】：

从此jQuery tutorial 中，您只需要使用相对于当前元素的元素偏移量。

var x = e.pageX - this.offsetLeft;

比你的css()

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

jsfiddle 上的代码示例。

【讨论】：

【解决方案2】：

你将不得不根据光标在元素中的位置来偏移它。

【讨论】：