//鼠标拖动div1:鼠标按住div,在document上拖动
var oDiv=document.getElementById('div1');
var disX=0;
var disY=0;
oDiv.onmousedown=function(ev){
    var oEvent=ev||event;
    disX=oEvent.clientX-oDiv.offsetLeft;
    disY=oEvent.clientY-oDiv.offsetTop;
    document.onmousemove=function(ev){
        var oEvent=ev||event;
        oDiv.style.left=oEvent.clientX-disX+'px';
        oDiv.style.top=oEvent.clientY-disY+'px';
        oDiv.innerHTML = "ev.clientX : "+ ev.clientX +  "<br/>ev.clientY : "+ ev.clientY
                + "<br/> evOffsetX  : " +disX+ "<br/> evOffsetY  : " +disY
                +  "<br/> left  : " +  oDiv.style.left    +  "<br/> TOP : " +  oDiv.style.top ;

    }
    document.onmouseup=function(ev){
        document.onmousemove=null;
        document.onmousedown=null;
    }
    return false;
}

  

<body>
  <div ></div>
</body>

  注意:

ev.offsetX
ev.clientX 
ev.pageX
ev.screenX

相关文章:

  • 2021-09-01
  • 2021-08-30
  • 2021-10-03
  • 2022-12-23
  • 2022-12-23
  • 2021-04-16
猜你喜欢
  • 2022-01-04
  • 2022-01-01
  • 2021-06-18
  • 2021-12-22
  • 2021-06-12
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案