firefox下实现可拖动层代码
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title> 拖动层效果代码</title> <script> var obj=0; var x=0; var y=0; var ie = (navigator.appVersion.indexOf("MSIE")!=-1);//IE var ff = (navigator.userAgent.indexOf("Firefox")!=-1);//Firefox function find(evt,objDiv){ obj = objDiv if (ff){ x = document.documentElement.scrollLeft + evt.layerX; y = document.documentElement.scrollTop + evt.layerY; if (document.documentElement.scrollTop > 0){ y = evt.layerY - document.documentElement.scrollTop; } if (document.documentElement.scrollLeft > 0){ x = evt.layerX - document.documentElement.scrollLeft; } } if (ie){ x = document.documentElement.scrollLeft + evt.offsetX; y = document.documentElement.scrollTop + evt.offsetY; if (document.documentElement.scrollTop > 0){ y = evt.offsetY - document.documentElement.scrollTop; } if (document.documentElement.scrollLeft > 0){ x = evt.offsetX - document.documentElement.scrollLeft; } } } function dragit(evt){ if(obj == 0){ return false } else{ obj.style.left = evt.clientX - x + "px"; obj.style.top = evt.clientY - y + "px"; } } </script> </head> <body onmousemove="dragit(event)" onmouseup="obj = 0"> <div> <div onmousedown="find(event,document.getElementById('aaa'))"></div> </div><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR> </body> </html>
JavaScript 中一些概念理解 ：clientX、clientY、offsetX、offsetY、screenX、screenY
clientX 设置或获取鼠标指针位置相对于窗口客户区域的 x 坐标，其中客户区域不包括窗口自身的控件和滚动条。
clientY 设置或获取鼠标指针位置相对于窗口客户区域的 y 坐标，其中客户区域不包括窗口自身的控件和滚动条。
offsetX 设置或获取鼠标指针位置相对于触发事件的（this）对象的 x 坐标。
offsetY 设置或获取鼠标指针位置相对于触发事件的（this）对象的 y 坐标。
screenX 设置或获取获取鼠标指针位置相对于用户屏幕的 x 坐标。
screenY 设置或获取鼠标指针位置相对于用户屏幕的 y 坐标。
x 设置或获取鼠标指针位置相对于父文档的 x 像素坐标。
y 设置或获取鼠标指针位置相对于父文档的 y 像素坐标。
如图：图片来源于网络
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。
您可能感兴趣的文章: