浏览器 窗口 scrollTop 的兼容性问题
来源:互联网 发布:mqtt java 编辑:程序博客网 时间:2024/06/03 22:56
今天做图片lazy load 需要得到页面的scrolltop值
当然如果有jquery 那么就直接
$(ele).scrollTop();
好了, 本文结束。。
不过 事实是没有这么舒服, 没有jquery..
好吧, 你不要告诉我去官网下一个。。
故事一般都是曲折的, 所以jquery 是不能 也不会有的。。
言归正传 这个值大家觉得烦 是因为有很多类似的
window.pageYOffset 被所有浏览器支持除了 IE 6, IE 7, IE 8, 不关doctype的事, 注IE9 开始支持此属性。
window.scrollY 被Firefox, Google Chrome , Safari支持 不关doctype的事, 注IE9 不支持此属性
在(quirk 模式)的时候 document.body.scrollTop 在 Internet Explorer, Firefox, Opera, Google Chrome Safari 返回正确的值。
在(quirk 模式)的时候 document.documentElement.scrollTop 永远是零
非quirk模式的时候 document.documentElement.scrollTop Internet Explorer, Firefox and Opera 返回正确的值 但是在 Google Chrome ,Safari 中永远是零
特整理一个表格如下
以上在win7环境下测试
可以看出是非常凌乱的
只在quirk模式下, body.scrollTop是被所有都支持的
所以这个表大家也不用 也没有必要去记, 只要记住一条
if(window.pageYOffset){//这一条滤去了大部分, 只留了IE678
}else if(document.documentElement.scrollTop ){//IE678 的非quirk模式
}else if(document.body.scrolltop){//IE678 的quirk模式
}
原则是看pageYOffset 然后看documentElement.scrollTop, 最后是document.body.scrollTop
当然 也可以直接scrollTop 而不使用pageYOffset
以下是MDN 提供的兼容性代码
scrolltop = (((t = document.documentElement) || (t = document.body.parentNode)) && typeof t.scrollTop == ‘number’ ? t : document.body).scrollTop
原文:http://www.qiongbupa.com/archives/887
- 浏览器 窗口 scrollTop 的兼容性问题
- js弹出子窗口的浏览器兼容性问题
- 浏览器的兼容性问题
- 浏览器的兼容性问题解决方案
- 浏览器的兼容性问题
- 浏览器兼容性问题的解决方案
- 浏览器的兼容性问题
- 浏览器的兼容性问题
- 浏览器的兼容性问题
- 常见的浏览器兼容性问题
- IE浏览器的兼容性问题
- IE浏览器的兼容性问题
- 常见的浏览器兼容性问题
- CSS浏览器的兼容性问题
- 浏览器的一些兼容性问题
- 常见的浏览器兼容性问题
- 浏览器的兼容性问题
- 常见的浏览器兼容性问题
- 分页,ajax。
- Oracle存储过程简单实例
- 原码 补码 反码
- 小议数据库主键选取策略
- Redhat / CentOS / Fedora Linux Open Port
- 浏览器 窗口 scrollTop 的兼容性问题
- 查找 矩阵中行与列中均为最大或者最小的数
- js返回及刷新
- net-snmp windows安装(mib2c)
- 嵌入式Linux之我行——S3C2440上LCD驱动(FrameBuffer)实例开发讲解(一)
- ADO.net执行存取过程时间过长的一个解决方式
- VS "安装和部署项目"生成的快捷方式问题
- 聚簇索引与非聚簇索引的区别以及SQL Server查询优化技术
- 应用python编写简单新浪微博应用(一)