function move(className) {
var isMove = false;
var X, Y;
$("."+className).click(function () {
}).mousedown(function (e) {
isMove = true;
X = e.pageX - parseInt($("."+className).css("left"));
Y = e.pageY - parseInt($("."+className).css("top"));
});
$(document).mousemove(function (e) {
pauseEvent(e);//防止mouseup事件丢失方法,详见下文
if (isMove) {
var left = e.pageX - X;
var top = e.pageY - Y;
$("."+className).css({left: left, top: top});
}
}).mouseup(function () {
isMove = false;
});
}
move("node");
由于此方法会因为mouseup事件丢失而导致鼠标松开后窗口依然跟随的情况,故应添加如下代码:
具体内容见:https://www.jianshu.com/p/5847b0e08ea8 中《mouseup事件丢失的原因与解决办法》
function pauseEvent(e){
if(e.stopPropagation) e.stopPropagation();
if(e.preventDefault) e.preventDefault();
e.cancelBubble=true;
e.returnValue=false;
return false;
}
网友评论