鼠标控制盒子在页面中移动

 1 //1.当我们鼠标按下，就获得鼠标在盒子内的坐标
 2         box.addEventListener(‘mousedown‘,function(e){
 3             var x = e.pageX - login.offsetLeft;
 4             var y = e.pageY - login.offsetTop;
 5             //2.鼠标移动的时候，把鼠标在页面中的坐标减去鼠标在盒子内的坐标就是模态版的left和top值
 6             document.addEventListener(‘mousemove‘,move);
 7             function move(e){
 8                 login.style.left = e.pageX - x + ‘px‘;
 9                 login.style.top = e.pageY-y + ‘px‘;
10             }
11             //3.鼠标弹起就让鼠标移动任务移除
12             document.addEventListener(‘mouseup‘,function(){
13                 document.removeEventListener(‘mousemove‘,move)
14             })
15         })