JavaScript-拖动层

这是第一次发博,博主属于菜鸟系列,如果有不对的地方欢迎指教,直接分享实例,非常好用,不过要注意各个div的z-index属性

 1     //拖动 “需要给id=show的div加上绝对定位position:absolute;”
 2     window.onload = function()
 3     {
 4         var div1 = document.getElementById("show");
 5         div1.onmousedown = function(ev){
 6             var oevent = ev || event;
 7             var distanceX = oevent.clientX - div1.offsetLeft;
 8             var distanceY = oevent.clientY - div1.offsetTop;
 9         
10             document.onmousemove = function(ev){
11             var oevent = ev || event;
12             div1.style.left = oevent.clientX - distanceX + 'px';
13             div1.style.top = oevent.clientY - distanceY + 'px'; 
14             }
15             document.onmouseup = function(){
16             document.onmousemove = null;
17             document.onmouseup = null;
18             }
19         }
20     }

 

转载于:https://www.cnblogs.com/huohuadidi/p/9640557.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值