1、各浏览器下 scrollTop的差异
IE6/7/8:
对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 ;
对于有doctype声明的页面则可以使用 document.documentElement.scrollTop  ;
Safari:
safari 比较特别,有自己获取scrollTop的函数 : window.pageYOffset ;
Firefox:
火狐等等相对标准些的浏览器就省心多了,直接用 document.documentElement.scrollTop ;
2、获取scrollTop值
完美的获取scrollTop 赋值短语 :
var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

通过这句赋值就能在任何情况下获得scrollTop 值。
仔细观察这句赋值,你发现啥了没??
没错, 就是 window.pageYOffset  (Safari)   被放置在 || 的中间位置。
因为当 数字0 与 undefine 进行 或运算时,系统默认返回最后一个值。即或运算中 0 == undefine ;
当页面滚动条刚好在最顶端,即scrollTop值为 0 时。  IE 下 window.pageYOffset  (Safari) 返回为 undefine ,此时将 window.pageYOffset  (Safari) 放在或运算最后面时, scrollTop 返回 undefine ,  undefine 用在接下去的运算就会报错咯。
而其他浏览器 无论 scrollTop 赋值或运算顺序如何都不会返回 undefine.  可以安全使用..
所以说到头还是IE的问题咯. 杯具…
精神有点恍惚,不知道有没有表达清楚。
不过最后总结出来这句实验过OK,大家放心使用;
var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

关于scrolltop 兼容 IE6/7/8, Safari,FF的方法的更多相关文章

  1. min-height最小高度的实现(兼容IE6、IE7、FF)(解决IE6不兼容min-height)

    <!doctype html><html> <head> <meta charset="UTF-8"> <meta name= ...

  2. 最新区分兼容IE6/IE7/IE8/IE9/FF的CSS HACK写法和Css if hack条件语法操作说明

    自从安装了IE8.0正式版本!木头 就对基本的几个 CSS HACK的做一下归纳!希望对网页前端布局DIV+CSS的实施者有所帮助! 本文就主要以:IE6+IE7+IE8+IE9+FF为主要研究对象 ...

  3. 区分兼容IE6/IE7/IE8/IE9/FF的CSS HACK写法

    HACK原理:不同浏览器对各中字符的识别不同 在 CSS中常用特殊字符识别表: (1)*:  IE6+IE7都能识别*,而标准浏览器FF+IE8是不能识别*的; (2)!important: 除IE6 ...

  4. div+css 布局下兼容IE6 IE7 FF常见问题

    div+css 布局下兼容IE6 IE7 FF常见问题 收藏 所有浏览器 通用 (市面上主要用到的IE6 IE7 FF)height: 100px; IE6 专用 _height: 100px; IE ...

  5. [转载]使用兼容ie6 ie7 ie8 FF的text-overflow:ellips

    使用兼容ie6 ie7 ie8 FF的text-overflow:ellipsis超出文本显示省略号来代替截取函数更有利于seo,如果使用截取函数,源代码中的标题是显示不完整的,即便是在title属性 ...

  6. 图片水平垂直居中(兼容IE6,IE7,firefox,opera,safari,其中图片可以是任何块元素)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 怎么用css hack处理各浏览器兼容IE6,IE7,IE8,IE9/ FF

    第一:什么事浏览器兼容性 浏览器兼容性问题又被称为网页兼容性或网站兼容性问题,指网页在各种浏览器上的显示效果可能不一致而产生浏览器和网页间的兼容问题.在网站的设计和制作中,做好浏览器兼容,才能够让网站 ...

  8. DIV CSS设计时IE6、IE7、FF 与兼容性有关的特性(转载的)

    在网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网乱可能出去不想出现的效果! 所有浏览器 ...

  9. [转载]DIV CSS设计时IE6、IE7、FF 与兼容性有关的特性

    在网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网乱可能出去不想出现的效果! 所有浏览器 ...

随机推荐

  1. Xcode5 + phoneGap2.9搭建ios开发环境-配置-测试-归档上传/phoneG...

    前言: 小弟是做JAVA/Android的第一次搞这个ios,公司有mobile项目是使用phoneGap开发的,需要开发ios版本.什么都不会只能一点一点琢磨了……大神越过…… 原文链接:http: ...

  2. mybatis-generator-config工具的使用

    generator.xml <?xml version="1.0" encoding="UTF-8" ?>   <!DOCTYPE gener ...

  3. Handle机制的原理

    Android提供了Handle和Looper来满足线程间的通信.Handle先进先出原则.Looper类用来管理特定线程内对象之间的消息交换(Message Exchange). 1.Looper: ...

  4. 浅谈学习掌握linux系统的优势

    Linux系统让我们懂得了共享.开放.自由可以让人类生活的更加美好,开源精神是一种让每个从事Linux行业的技术人员从骨子里自豪的情怀,开源产品的兴盛受益于开源社区的强壮根基.Linux真的给了我很多 ...

  5. 1310. ACM Diagnostics

    http://acm.timus.ru/problem.aspx?space=1&num=1310 题目中说的 “the lexicographically increasing list” ...

  6. mongodb 备份 还原 导出 导入

    张映 发表于 2013-12-03 分类目录: nosql 标签:mongodb, 备份, 导入, 导出, 还原 mongodb数据备份和还原主要分为二种,一种是针对于库的mongodump和mong ...

  7. 怎么将Android studio 的“ build:gradle改低一点”

    参考来源:http://bbs.qcloud.com/thread-17193-1-1.html Error:Execution failed for task ':xxxx:compileDebug ...

  8. sql server2008 r2 密钥

    Microsoft SQL Server 2008 R2序列号密钥 数据中心版32位:PTTFM-X467G-P7RH2-3Q6CG-4DMYB数据中心版64位:DDT3B-8W62X-P9JD6-8 ...

  9. React Native 打包.jsx文件

    最近在研究React Native.感觉开发效率确实不错,但jsx语法写起来感觉不怎么顺手. 试用了Sublime Text 3和Visual Studio Code写代码,感觉反应总是慢一拍. 还是 ...

  10. JAVA小知识

    eclipse是日蚀的意思,eclipse是IBM公司的,当年和SUN公司的java竞争,sun的意思是太阳,所以你明白了? Java的起名是 java(爪哇)咖啡,java原意是爪哇的意思,当初起名 ...