js的拖拽及实现

js的拖拽效果的三个事件：

mousedown 鼠标按下事件
mousemove 鼠标移动事件
mouseup 鼠标抬起事件
当点击dom的时候，记录当前鼠标的坐标值，也就是x、y值，以及被拖拽的dom的top、left值，而且还要在鼠标按下的回调函数里添加鼠标移动的事件：

document.addEventListener(“mousemove”, moving, false)
和添加鼠标抬起的事件

document.addEventListener(“mouseup”,function() { document.removeEventListener(“mousemove”, moving, false);}, false);
这个抬起的事件是为了解除鼠标移动的监听，因为只有在鼠标按下才可以拖拽，抬起就停止不会移动了。

当鼠标按下鼠标移动的时候，记录移动中的x、y值，那么这个被拖拽的dom的top和left值就是：

top=e.clientY-offsetY
div的top等于当前鼠标距离可视区域的距离 减去鼠标距离div边缘的距离
left=e.clientX-offsetX
div的left等于当前鼠标距离可视区域的距离 减去鼠标距离div边缘的距离