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);
document.body.scrollTop or document.documentElement.scrollTop的更多相关文章
- 火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题
一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.on ...
- document.documentElement.scrollTop || document.body.scrollTop
如果有doctype的声明,需要用document.documentElement.scrollTop没有doctype的声明,用document.body.scrollTop
- document.body.scrollTop vs document.documentElement.scrollTop
window.addEventListener("scroll", function () { if (document.body.scrollTop >= window.i ...
- document.body.scrollTop vs document.documentElement.scrollTop && document.body.scrollHeight vs document.documentElement.scrollHeight
FireFox下 document.body.scrollHeight || document.documentElement.scrollHeight;//等价 document.body.scro ...
- document.body.scrollTop与document.documentElement.scrollTop兼容
这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声 ...
- js中的document.body.scrollTop与document.documentElement.scrollTop
获取当前页面滚动条纵坐标的位置:document.body.scrollTop与document.documentElement.scrollTop获取当前页面滚动条横坐标的位置:document.b ...
- 关于document.body.scrollTop与documentElement.scrollTop
遇到document.body.scrollTop值为0的问题 今天在写一个小demo的时候,使用滚动条,我用document.body.scrollTop获取滚动条的位置,但是很奇怪的发现在谷歌上获 ...
- document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题
转自http://wo13145219.iteye.com/blog/2001598 一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取do ...
- document.documentElement.scrollTop(获取滚动条位置)
要获取当前页面的滚动条纵坐标位置,用:document.documentElement.scrollTop;而不是:document.body.scrollTop;documentElement 对应 ...
随机推荐
- Pushlet浏览器长连接通讯
原文链接:http://cuisuqiang.iteye.com/blog/1416771 Pushlet(一种comet 架构的实现)是基于Servlet 机制,数据从server端的Java 对象 ...
- Arduino101学习笔记（八）—— 函数库
/*********最小值*********/ min() //实现:#define min(a,b) ((a)<(b)?(a):(b)) /*********最大值*********/ max ...
- async4j 普通用法、整合spring用法
1.普通用法 asyn4j 是一个java异步方法调用框架,基于消费者与生产者模式. async4j就是基于Executors线程池和反射机制实现的. 包括了异步方法执行,异步回调执行,异步工作缓存模 ...
- asp.net权限控制配置web.config
项目下 有三个文件夹 A,B,C 验正方式是 Forms 验正 我要设置他们的访问权限为, A,匿名可访问 B,普通用户授权后才能访问 C,只允许管理员访问 <configuration> ...
- 记一次小团队Git实践(下)
在上篇中,我们已经能基本使用git了,接下来继续更深入的挖掘一下git. 更多的配置自定义信息 除了前面讲的用户名和邮箱的配置,还可以自定义其他配置: # 自定义你喜欢的编辑器,可选 git conf ...
- Spring的LoadTimeWeaver(代码织入)
在Java 语言中,从织入切面的方式上来看,存在三种织入方式:编译期织入.类加载期织入和运行期织入.编译期织入是指在Java编译期,采用特殊的编译器,将切面织入到Java类中:而类加载期织入则指通过特 ...
- DOM--3 DOM核心和DOM2 HTML(2)
核心Node对象 由于继承扩展的关系,DOM中大部分对象会有Node对象的属性和方法,其中包括: nodeName DOM2核心中规定的每种nodeType预期的nodeName值 对象 返回值 El ...
- redis 的使用 ( list列表类型操作)
list 数据类型 列表类型 list 类型是一个双向操作 从链表的头部或者尾部添加删除元素 list 既可以用作栈 也可以用作队列 list 链表的类型应用场合: 获取最新的 10 个用户的信息 s ...
- Scau 8633 回文划分 mancher + dp
时间限制:1000MS 内存限制:1000K 提交次数: 通过次数: 题型: 编程题 语言: G++;GCC Description 我们说一个字符串是回文串,那么意味着这个串从两边读起来的字母都是一 ...
- Python基础8- 序列
序列是一组有顺序的元素的集合序列的成员是有序排列的且可以通过下标偏移量来访问它的一个或几个成员序列可以包含一个或多个元素,也可以没有任何元素序列有两种类型:列表(list)和元组(tuple),两者的 ...