• js 原生_拖动页面元素,松开释放


    嗯哼。不多说,直接上代码了。

    • // 为元素 绑定拖动事件
      function bindDragEvent(obj){
          obj.onmousedown = function(e){
              e = e || window.event;
              
              obj.setCapture && obj.setCapture();    // IE8 及以下 强制捕获下一次单击事件
              
              obj.fixedX = e.clientX - (obj.getBoundingClientRect().left - document.documentElement.clientLeft);
              obj.fixedY = e.clientY - (obj.getBoundingClientRect().top - document.documentElement.clientTop);
              
              document.onmousemove = function(e){
                  e = e || window.event;
                  
                  var x = e.clientX + (document.documentElement.scrollLeft || window.pageXOffset || document.body.scrollLeft);
                  var y = e.clientY + (document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop);
                  
                  obj.style.left = x - obj.fixedX + "px";    // 元素在页面中的坐标 = 鼠标在页面中的坐标 - 元素在页面中的坐标
                  obj.style.top = y - obj.fixedY + "px";
              };
              
              document.onmouseup = function(){
                  document.onmousemove = null;    // 解除 鼠标移动div跟随 事件
                  document.onmouseup = null;    // 解除鼠标松开事件
                  obj.releaseCapture && obj.releaseCapture();    // IE8 及以下 解除强制捕获单击事件
              };
              
              return false;
          };
      }
    --------小尾巴 ________一个人欣赏-最后一朵颜色的消逝-忠诚于我的是·一颗叫做野的心.决不受人奴役.怒火中生的那一刻·终将结束...
  • 相关阅读:
    Git 使用记录
    AngularJS $http返回的数据类型
    angularJS 使用$http 出现 $http.get(...).success is not a function
    JS数组及其方法(slice,contact...)
    HTML5的localStorage和sessionStorage
    promise async await 结合 demo2
    promise async await 结合 demo1
    git 命令
    git
    new 优先级的题目
  • 原文地址:https://www.cnblogs.com/tianxiaxuange/p/9873939.html
Copyright © 2020-2023  润新知