获取body相对于屏幕的位置,还是比较郁闷的,下面是本人的方法:
可选择的有screenLeft,screenTop,screenX,screenY,不过由于工具栏高度未知,所以很难计算出body的位置.
ie:window.screenLeft,window.screenTop为body相对于屏幕的位置(或许是html元素),(不用担心高度不定的工具条了)...
opera: 和IE一样, screenX和screenY始终为-4和-23,奇怪...(也不用担心可以随意拖动高度的工具条了)
ff: screenTop无值,screenY为浏览器相对于屏幕的位置...这样要加上工具条高度,(不过工具条高度不一定啊)...因此ff是无解的...
safari和chrome 取到的值也是浏览器在屏幕的位置,也无解
废话不多,上终极方法,就是e.screenX-e.clientX和e.screenY-e.clientY,就能取到body相对于屏幕的偏移,只是,要用户鼠标动一下才能取到值...
<!DOCTYPE html> <head> <style> body,html{ background: blue; } </style> <script> function onInit(e){ var e = e||window.event; //除ff //alert([window.screenLeft,window.screenTop]); //除ie (不过op取到的值有些怪异) //alert([window.screenX,window.screenY]); //由于状态栏的不确定,导致下面方法基本是无用的 //alert([window.outerHeight,window.innerHeight,window.outerHeight-window.innerHeight]) //用事件取值大法 getBodyOffset(); } function getBodyOffset(){ if(window.attachEvent) document.attachEvent("onmousemove",getScreenPx); else if(window.addEventListener) document.addEventListener("mousemove",getScreenPx,false); } function getScreenPx(e){ var e = window.event||e; window.bodyOffset = [e.screenX-e.clientX,e.screenY-e.clientY]; } </script> </head> <body onload="onInit(event)"> <div style="width:300px;height:600px;border:1px solid red;"></div> <input type="button" onclick="alert(window.bodyOffset)" /> </body> </html>