鼠标松开依旧移动

来源:4-2 [DOM事件] QQ面板拖拽效果(下)

慕勒9246139

2017-03-03 15:18

function fnDown(event){
   event=event || window.event;
   //光标按下时光标和面板之间的距离
   var disX=event.clientX-login_box.offsetLeft;
   var disY=event.clientY-login_box.offsetTop;
   //mousemove:当鼠标指针在元素内部移动时重复的触发
   addEvent(document,'mousemove',function(event){
       event=event || window.event;
       winw=document.documentElement.clientWidth||document.body.clientWidth;
       winh=document.documentElement.clientHeight||document.body.clientHeight;
       maxW=winw-login_box.offsetWidth;
       maxH=winh-login_box.offsetHeight;
       var w=event.clientX-disX;
       var h=event.clientY-disY;
       //不出边界
       if(w<0){
           w=0;
       }else if(w>maxW){
           w=maxW;
       }
       if(h<0){
           h=0;
       }else if(h>maxH){
           h=maxH;
       }
       login_box.style.left=w+'px';
       login_box.style.top=h+'px';

   })
   //释放鼠标
   document.onmouseup=function(){
       document.onmousemove=null;
       document.onmouseup=null;
   }

}

写回答 关注

1回答

  • 白小九
    2017-03-06 16:15:11
    已采纳

    用addEventListener(或attachEvent)添加的事件,必须用removeEventListener(或detachEvent)移除

    慕勒9246...

    非常感谢你,我知道哪不对了,谢谢谢谢

    2017-03-07 12:01:27

    共 2 条回复 >

DOM事件探秘

DOM事件?本课程会通过实例来给小伙伴们讲解如何使用这些事件

99545 学习 · 1197 问题

查看课程

相似问题