复制代码代码如下 :
<헤드>
<title> js s div 相对坐标 </title>
<script type = "text/javaScript"> <!-
함수 getx (obj) {
var parobj = obj;
var left = obj.offsetleft;
while (parobj = parobj.offsetparent) {
왼쪽+= parobj.offsetleft;
}
왼쪽으로 돌아갑니다.
}
함수 gety (obj) {
var parobj = obj;
var top = obj.offsetTop;
while (parobj = parobj.offsetparent) {
top+= parobj.offsettop;
}
리턴 탑;
}
함수 displayCoord (이벤트) {
var 탑, 왼쪽, odiv;
odiv = document.getElementById ( "데모");
top = gety (odiv);
왼쪽 = 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>
<바디 스타일 = "마진 : 40px;" mce_style = "마진 : 40px;">
<div style = "배경색 :#000000; 색상 :#0011ff; 너비 : 300px; 높이 : 300px; 위치 : 절대; 상단 : 80px; 왼쪽 : 90px; 마진 : 0px; 경계 : 0px;" id = "demo"onmouseMove = "displayCoord (이벤트)">
我是 div, 经测试, 有 2px 的误差 ...
</div>
当前鼠标坐标为 ：
x ： <span id = "mp_x"> </span>
y ： <span id = "mp_y"> </span>
</body>
</body>
</html>
如果不对, 可以试试将
document.documentElement.scrollleft
替换成
document.body.scrollleft