各浏览器下 scrollTop的差异
IE6/7/8:
对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 ;
对于有doctype声明的页面则可以使用 document.documentElement.scrollTop;
Safari:
safari 比较特别,有自己获取scrollTop的函数 : window.pageYOffset ;
Firefox:
火狐等等相对标准些的浏览器就省心多了,直接用 document.documentElement.scrollTop ;
兼容写法
var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
注意:
$('body').scrollTop()在chrome正确,火狐无效为0,
$(window).scrollTop(),$(document).scrollTop()兼容火狐 JQ滚动动画兼容
$('html,body').animate({
  'scrollTop': scrollTop
}, timeInterval)

  

 

scrollTop的兼容性的更多相关文章

  1. scroll事件的优化以及scrollTop的兼容性

    scrollTop的兼容性 scroll事件,当用户滚动带滚动条的元素中的内容时,在该元素上面触发.<body>元素中包含所加载页面的滚动条. 虽然scroll事件是在window对象上发 ...

  2. 浏览器 窗口 scrollTop 的兼容性问题

    window.pageYOffset 被所有浏览器支持除了 IE 6, IE 7, IE 8, 不关doctype的事, 注IE9 开始支持此属性. window.scrollY 被Firefox, ...

  3. onsrcoll和scrollTop兼容与实现

    对于onscroll事件的支持 各浏览器 document.document.body.document.documentElement 对象的 onscroll 事件的支持存在差异. 所谓的支持性存 ...

  4. 怎么得到scrollTop

    我们学习一个事件 :  页面滚动效果 window.onscroll = function() { 页面滚动语句  } 谷歌浏览器 和没有声明 DTD  <DOCTYPE     > : ...

  5. JavaScript中尺寸、坐标

    测试环境是IE8,Chrome38,Firefox40,下面是全局通用脚本打印代码 /** * 打印 */ function write(str) { document.write(str + '&l ...

  6. JS原生第七篇 (帅哥)

    1.1 复习 offset   自己的 偏移 offsetWidth    得到自己的宽度 offsetHeight 构成 :   width  +   padding  +  border div ...

  7. js 获取元素在页面上的偏移量的最佳方式

    使用js制作效果时,我们常常要获取某个元素在页面上的偏移量(例如tip提示框功能).而获取偏移量可以直接获取相对于document的偏移量,也可以获取相对与视口的偏移量(viewpoint)加上页面滚 ...

  8. Top值

    业务开发中经常会用到元素或者浏览器窗口的各种top值,最近开发组件的过程中也遇到各种问题,因此决定好好总结一下. 常见的top值 scrollTop Element.scrollTop 属性可以获取或 ...

  9. Javascript中与Scroll有关的方法

    这块确实太乱了,被兼容搞的简直快要晕死,默默地总结下... 与scroll相关的方法 4个window对象下:scrollX.scrollY.scrollTo.scroll(作用和scrollTo一样 ...

随机推荐

  1. IT连创业系列:App产品上线后,运营怎么搞?(上)

    又是一阵一阵的时光过去了,今夜,码的不是代码,是文字,继续和大伙分享创业的这一路历程. 话说,在突破技术的领域,IT连和IT恋上线后,慢慢走上运营这条路时,发现自己经常容易迷失. 毕竟,做为一名技术型 ...

  2. 十二、Hadoop学习笔记————Hive的基本原理

    一般用户用CLI(命令行界面)接口,元数据库含有表结构 单用户.多用户.远程服务 生成db文件,只能单客户端使用数据库 多用户是最常用的使用模式 配置与多用户一致 数据格式用户自定义 所有的表都存于改 ...

  3. php条件语句(二)

    switch 语句用于根据多个不同条件执行不同动作. PHP Switch 语句 如果您希望有选择地执行若干代码块之一,请使用 switch 语句. 语法 switch (n){case label1 ...

  4. iOS11UINavigationBar的item左右间距调整

    相信很多同学都知道在iOS7之后调整导航栏两侧按钮距离左右间距,其实就是在左右barButtonItem的数组中添加一个宽度为负的占位item. - (void)addLeftBarButtonIte ...

  5. 案例学习总结:原生JS实现表格排序

    最近在学习js的表格排序,没想到看不起眼的表格排序实际上却暗含了众多JS知识点.在这里记录一下此次学习过程.希望对大家也有所帮助. 完整的表格排序涉及了下列这些知识点: call方法使用 sort方法 ...

  6. Shell编程基础篇-下

    1.1 条件表达式 1.1.1 文件判断 常用文件测试操作符 常用文件测试操作符 说明 -d文件,d的全拼为directory 文件存在且为目录则为真,即测试表达式成立 -f文件,f的全拼为file ...

  7. 深入理解php内核 编写扩展 II:参数、数组和ZVALs

    原文:http://devzone.zend.com/article/1022-Extension-Writing-Part-II-Parameters-Arrays-and-ZVALs Part I ...

  8. 基于Spring Aop实现类似shiro的简单权限校验功能

    在我们的web开发过程中,经常需要用到功能权限校验,验证用户是否有某个角色或者权限,目前有很多框架,如Shiro Shiro有基于自定义登录界面的版本,也有基于CAS登录的版本,目前我们的系统是基于C ...

  9. HTTP协议之URL

    1.什么是URL URL的全称是Uniform Resoure Locator,统一资源定位器.URL是浏览器寻找信息时所需的资源位置.当一个人将浏览器指向一个URL,浏览器就会在幕后发送适当的协议报 ...

  10. C++雾中风景4:多态引出的困惑,对象的拷贝?

    C++作为一门面向对象的语言,自然具备了面向对象的三大特征:封装,继承,多态.在学习多态性质的过程中,发现了C++与其他语言很大的区别(坑?).在C++中的=操作符的使用与C++呈现的内存模型似乎并不 ...