document.body.scrollTop or document.documentElement.scrollTop

用Javascript获取DOM节点相对于页面的绝对坐标时，需要计算当前页面的滚动距离，而这个值的获取又取决于浏览器。

　　在Firefox或Chrome浏览器的控制台可以查看document.body 对应于页面中 <body></body>部分的元素，而document.documentElement则相当于整个HTML，说明浏览器在解释渲染后的页面位置范围是存在不同的，FF、Opera和IE浏览器认为在客户端浏览器展示的页面的内容对应于整个HTML，所以使用document.documentElement来代表，相应的滚动距离则通过document.documentElement.scrollLeft 和 document.documentElement.scrollTop来获取，而Safari和Chrome浏览器则认为页面开始于body部分，从而相应的滚动距离用document.body.scrollLeft 和 document.body.scrollTop来获取。另外需要注意的是，FF和IE的quirks mode（兼容模式）下是用document.body来获取的。

　　针对跨浏览器的解决方案则可简单的用如下代码获取：

　　

var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);

var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);

时间： 2024-11-13 09:34:40

document.body.scrollTop or document.documentElement.scrollTop的相关文章

document.documentElement.scrollTop

要获取当前页面的滚动条纵坐标位置, 用:      document.documentElement.scrollTop; 而不是:      document.body.scrollTop; documentElement 对应的是 html 标签,而 body 对应的是 body 标签. 在标准w3c下,document.body.scrollTop恒为0,需要用document.documentElement.scrollTop来代替    如果你想定位鼠标相对于页面的绝对位置时,你会发现

top:expression(eval(document.documentElement.scrollTop));

top:定义元素顶部在页面中的位置: expression:css中引用javascript的属性: document.documentElement.scrollTop:页面滚动条纵向位置坐标(documentElement是对于html标签,针对body标签的是body). ps--外话一句,在加了DTD的标准化W3C下,document.body.scrollTop恒为0,需要用document.documentElement.scrollTop代替(ie和firefox确实如此).但是我

document.body.scrollTop与document.documentElement.scrollTop兼容

项目中遇到这个小问题,看到有前辈总结,借来用一下 document.body.scrollTop与document.documentElement.scrollTop兼容 这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声明(即网页第一句的docType)的情况下,标准浏览器是只认识documentElement.scrollTop的,但chrom

document.documentElement.scrollTop||document.body.scrollTop;

这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声明(即网页第一句的docType)的情况下,标准浏览器是只认识documentElement.scrollTop的,但chrome虽然我感觉比firefox还标准,但却不认识这个,在有文档声明时,chrome也只认识document.body.scrollTop. 由于在不同情况下,document

document.documentElement.scrollTop(获取滚动条位置)

要获取当前页面的滚动条纵坐标位置,用:document.documentElement.scrollTop;而不是:document.body.scrollTop;documentElement 对应的是 html 标签,而 body 对应的是 body 标签. 在标准w3c下,document.body.scrollTop恒为0,需要用document.documentElement.scrollTop来代替; 一般在定义时,代码如下: var scrollTop=document.docum

火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.onscroll=function () { var oId=document.getElementByIdx_x("id"); oId.style.top=document.body.scrollTop+"px"; } 可是怎么没有达到预期效果呢,输出document.b

document.body.clientHeight和document.documentElement.clientHeight区别

document.body.clientHeight:body对象的高度 document.documentElement.clientHeight:指可见区域的高度 获取元素中滚动条的垂直偏移可以写成: var top = document.documentElement.scrollTop || document.body.scrollTop; document.body.clientHeight和document.documentElement.clientHeight区别

[No000068]document.body.clientHeight 和 document.documentElement.clientHeight 的区别

document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 注意开头<!DOCTYPE ..>的声明,没有该声明时,document.documentElement.clientHe

jquery插件开发;(function ( $, window, document, undefined ){}(jQuery, window,document)分析

经常看到许多jquery插件是这种形式: ;(function( $, window, document, undefined ){}){ //...code }(jquery,window,document) 一开始自己也是不太清楚,后台查了许多资料博客,基本了解大意,所以总结出来,以供之后查阅更正. 1.自调函数(function(){})() 这是一个自调函数,函数定义后自行调用.将匿名函数放在括号之内,并紧跟一个括号.第二个括号的意思是"立即调用".同时第二个括号也是向匿名函数