87,993
社区成员
发帖
与我相关
我的任务
分享
$(function()
{
$("#div1").mousedown(function(event)
{
var offset = $(this).offset();
_x = event.clientX - offset.left;
_y = event.clientY - offset.top;
$(this).bind("mousemove", function(event)
{
$("#x").html(event.clientX);
$("#y").html(event.clientY);
_xx = event.clientX - _x;
_yy = event.clientY - _y;
$(this).css({ left: _xx + "px", top: _yy + "px" });
}).mouseup(function(event)
{
$(this).unbind('mousemove').unbind('mouseup');
});
});
});
$(function()
{
$("#div1").mousedown(function(event)
{
var offset = $(this).offset();
_x = event.clientX - offset.left;
_y = event.clientY - offset.top;
$(document).bind("mousemove", function(event)
{
$("#x").html(event.clientX);
$("#y").html(event.clientY);
_xx = event.clientX - _x;
_yy = event.clientY - _y;
$("#div1").css({ left: _xx + "px", top: _yy + "px" });
}).mouseup(function(event)
{
$(this).unbind('mousemove').unbind('mouseup');
});
});
});
这个很容易想明白啊
拖动的原理 就是当你鼠标移动的时候 DIV跟着鼠标跑
所以在整个文档范围内 你鼠标移动到哪 DIV通过计算后 就跟着跑到哪就对了.
你如果把mousemove放到div的时候 你鼠标慢点不脱离DIV可以
但你迅速移开 鼠标直接就指向文档document了 当然div.onmouseover就没被触发了..