zoukankan      html  css  js  c++  java
  • JS拖动技术 关于setCapture (转自 剑胆琴心.Net学习笔记)

    <script type="text/javascript">
    <!--
    window.onload=function(){
      objDiv = document.getElementById('drag');
      drag(objDiv);
    };

    function drag(dv){
      dv.onmousedown=function(e){
          var d=document;
          e = e || window.event;
         
          var x= e.layerX || e.offsetX;
          var y= e.layerY || e.offsetY;
         
          //设置捕获范围
          if(dv.setCapture){
              dv.setCapture();
          }else if(window.captureEvents){
              window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
          }
         

          d.onmousemove=function(e){
               e= e || window.event;
               if(!e.pageX)e.pageX=e.clientX;
               if(!e.pageY)e.pageY=e.clientY;
               var tx=e.pageX-x;
               var ty=e.pageY-y;
              
               dv.style.left=tx;
               dv.style.top=ty;
          };

          d.onmouseup=function(){
               //取消捕获范围
               if(dv.releaseCapture){
                  dv.releaseCapture();
               }else if(window.captureEvents){
                  window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
               }
              
              //清除事件
              d.onmousemove=null;
              d.onmouseup=null;
          };
       };
    }
    //-->
    </script>

    <div id="drag" style="position:absolute;left:12px;top:24px;100;height:150;border:1px solid #000000;z-index:1;background:#eeeeee">drag me</div>




    --------------------------------------
    setCapture 的意思就是设置一个对象的方法被触发的范围,或者作用域。
    如果不设置,则div只在当前窗口内被触发。如果设置,则在整个浏览器范围内被触发,也就是可以拖到浏览器外面

  • 相关阅读:
    解决DeDeCms文章中上传的图片点击新窗口打开的方法
    织梦dedecms 5.7解决修改文章后,发布时间自动更新的方法
    织梦DedeCMS实用技巧-八大安全措施
    data目录迁移到web以外目录
    《DSP using MATLAB》示例Example6.6
    《DSP using MATLAB》示例 Example 6.5
    《DSP using MATLAB》示例Example6.4
    《DSP using MATLAB 》示例Example6.3
    《DSP using MATLAB》示例Example6.2
    《DSP using MATLAB》示例Example6.1
  • 原文地址:https://www.cnblogs.com/Godblessyou/p/1196746.html
Copyright © 2011-2022 走看看