模拟 DIV 的拖动，鼠标指针快速移动的问题

Question

我需要模拟拖动效果，基本上当用户click和kept hold鼠标放在 DIV 上时，应该根据鼠标坐标（跟随鼠标）重新定位。

这个脚本工作正常：

http://jsbin.com/vurumupoqu/1/

除非用户在 DIV 边缘附近单击并按住并快速移动并远离 DIV 外的鼠标，否则在这种情况下根本不会被拖动。

我尝试了好几种选项与mouseleave和mouseout与没有成功。

即使用户在页面上的任何位置按住键时快速移动鼠标，我也需要拖动 DIV。

我想知道：

• 如何解决这个问题？（我的意思是针对最新的 Chrome 和 Firefix）。
• 使用 HTML5 拖动可能是更好的选择吗？如果是，为什么？

Answer 1

将mousemove事件处理程序绑定到document而不是元素本身：

document.addEventListener('mousemove', function (event) {
    console.log('+ mousemove')
    this.logicDrag();
}.bind(this));

http://jsbin.com/deyiwaqeqa/2/

解释

mousemove当您四处移动鼠标时，不会为每个像素触发一个事件。这意味着鼠标可能已经离开#target- 之前#target已被移动以匹配新的鼠标位置。