源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

JS拖动技术 关于setCapture使用

  • 时间:2021-11-07 01:35 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:JS拖动技术 关于setCapture使用
JS拖动技术--- 关于setCapture (转自 剑胆琴心-.Net学习笔记)
[u]复制代码[/u] 代码如下:
<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;width:100;height:150;border:1px solid #000000;z-index:1;background:#eeeeee">drag me</div>
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部