先介绍几个属性：（暂时只测了IE和firefox，实际上我工作中用到的最多的是chrome）
网页被卷起来的高度/宽度（即浏览器滚动条滚动后隐藏的页面内容高度）
(
javascript)
document.documentElement.scrollTop
//firefox
(
javascript
)
document.documentElement.scrollLeft
//firefox
(
javascript
)
document.body.scrollTop //IE
(
javascript
)
document.body.scrollLeft //IE
(
jqurey
)
$(window).scrollTop()
(
jqurey
)
$(window).scrollLeft()
网页工作区域的高度和宽度
(javascript)
document.documentElement.clientHeight
// IE firefox
(jqurey)
$(window).height()
元素距离文档顶端和左边的偏移值
(javascript)
DOM元素对象.offsetTop
//IE firefox
(javascript)
DOM元素对象.offsetLeft
//IE firefox
(jqurey)
jq对象.offset().top
(jqurey)
jq对象.offset().left
获取页面元素距离浏览器工作区顶端的距离
页面元素距离浏览器工作区顶端的距离
=
元素距离文档顶端偏移值
–
网页被卷起来的高度
即：
页面元素距离浏览器工作区顶端的距离
=
DOM元素对象.offsetTop
–
document.documentElement.scrollTop
举个应用例子：(个人习惯用jqurey，免去兼容性烦恼)
利用 页面元素距离浏览器工作区顶端/左端的距离 来实现一个提示框在页面不同位置时候保证提示信息显示的正确位置，如图所示 附代码
可见不管输入框在哪里，提示框信息永远都显示在正确的位置，而不会在弹出提示框时候被挡。
备注：
网页可见区域宽： document.documentElement.clientWidth;
网页可见区域高： document.documentElement.clientHeight;
网页正文全文宽： document.documentElement.scrollWidth;
网页正文全文高： document.documentElement.scrollHeight;
网页被卷去的高(ff)：document.body.scrollTop;
网页被卷去的高(ie): document.documentElement.scrollTop;
网页被卷去的左：document.body.scrollLeft;
网页正文部分上：window.screenTop;
网页正文部分左：window.screenLeft;
某个元素的宽度：obj.offsetWidth;
某个元素的高度：obj.offsetHeight;
某个元素的上边界到body最顶部的距离：obj.offsetTop;（在元素的包含元素不含滚动条的情况下）
某个元素的左边界到body最左边的距离：obj.offsetLeft;（在元素的包含元素不含滚动条的情况下）
返回当前元素的上边界到它的包含元素的上边界的偏移量：obj.offsetTop（在元素的包含元素含滚动条的情况下）
返回当前元素的左边界到它的包含元素的左边界的偏移量：obj.offsetLeft（在元素的包含元素含滚动条的情况下）
