zoukankan      html  css  js  c++  java
  • 精简版拖动

    /* 鼠标拖动 */
    var oDrag = "";
    var ox,oy,nx,ny,dy,dx;
    function drag(e,o){
     var e = e ? e : event;
     var m = document.all ? 1 : 0;
     if(e.button == m)
     {
      if (o.parentNode)
      {
       oDrag = o.parentNode;
      }
      else{oDrag = o;}
      ox = e.clientX;
      oy = e.clientY;  
     }
    }
    function dragPro(e){
     if(oDrag != "")
     { 
      //var obj=document.getElementById("msg");//拖动的id
      var obj=oDrag;//拖动的id
      var e = e ? e : event;
      obj.style.position = 'absolute';
      dx = parseInt(obj.style.left);
      dy = parseInt(obj.style.top);
      if(isNaN(dx)){dx=0;}
      if(isNaN(dy)){dy=0;}
      nx = e.clientX;
      ny = e.clientY;
      obj.style.left = (dx + ( nx - ox )) + "px";
      obj.style.top = (dy + ( ny - oy )) + "px";
      ox = nx;
      oy = ny;
     }
    }
    document.onmouseup = function(){oDrag = "";}
    document.onmousemove = function(event){dragPro(event);}


    调用的时候onmousedown='drag(event,this)'

    不会用博客园的贴效果……演示无法提供……
  • 相关阅读:
    webpack--------类似gulp的工具,在gulp后面出来的
    canvas 绘制矩形
    HTML5 Canvas基础知识
    视差滚动效果
    闭包的理解
    AJAX 跨域
    json与jsonp的区别
    针对AJAX与JSONP的异同
    如何使用JSONP
    JSONP的客户端的具体实现
  • 原文地址:https://www.cnblogs.com/rayking/p/1216396.html
Copyright © 2011-2022 走看看