您现在的位置： 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文
如何获取鼠标在div中的相对位置
作者：佚名 责任编辑：admin 更新时间：2022-06-22
如何获取鼠标在div中的相对位置，其实是很简单，下有个不错的示例，感兴趣的朋友可以参考下
代码如下: <HEAD> <TITLE> JS获取DIV相对坐标</TITLE> <script type="text/javascript"><!-- function getX(obj){ var parObj=obj; var left=obj.offsetLeft; while(parObj=parObj.offsetParent){ left+=parObj.offsetLeft; } return left; } function getY(obj){ var parObj=obj; var top=obj.offsetTop; while(parObj = parObj.offsetParent){ top+=parObj.offsetTop; } return top; } function DisplayCoord(event){ var top,left,oDiv; oDiv=document.getElementById("demo"); top=getY(oDiv); left=getX(oDiv); document.getElementById("mp_x").innerHTML = (event.clientX-left+document.documentElement.scrollLeft) -2+"px"; document.getElementById("mp_y").innerHTML = (event.clientY-top+document.documentElement.scrollTop) -2+"px"; } // --></script> </HEAD> <BODY style="margin:40px;" mce_style="margin:40px;"> <div style="background-color:#000000;color:#0011FF;width:300px;height:300px;position:absolute;top:80px;left:90px;margin:0px; border:0px;" id="demo" onmousemove="DisplayCoord(event)"> 我是DIV,经测试,有2PX的误差... </div> 当前鼠标坐标为： X：<span id="mp_x"></span> Y：<span id="mp_y"></span> </body> </BODY> </HTML> 如果不对，可以试试将 document.documentElement.scrollLeft 替换成 document.body.scrollLeft- 上一个程序编程： input链接页面、打开新网页等等的具体实现
- 下一个程序编程： css3元素简单的闪烁效果实现
