scrollTop的兼容性
各浏览器下 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的兼容性的更多相关文章
- scroll事件的优化以及scrollTop的兼容性
scrollTop的兼容性 scroll事件,当用户滚动带滚动条的元素中的内容时,在该元素上面触发.<body>元素中包含所加载页面的滚动条. 虽然scroll事件是在window对象上发 ...
- 浏览器 窗口 scrollTop 的兼容性问题
window.pageYOffset 被所有浏览器支持除了 IE 6, IE 7, IE 8, 不关doctype的事, 注IE9 开始支持此属性. window.scrollY 被Firefox, ...
- onsrcoll和scrollTop兼容与实现
对于onscroll事件的支持 各浏览器 document.document.body.document.documentElement 对象的 onscroll 事件的支持存在差异. 所谓的支持性存 ...
- 怎么得到scrollTop
我们学习一个事件 : 页面滚动效果 window.onscroll = function() { 页面滚动语句 } 谷歌浏览器 和没有声明 DTD <DOCTYPE > : ...
- JavaScript中尺寸、坐标
测试环境是IE8,Chrome38,Firefox40,下面是全局通用脚本打印代码 /** * 打印 */ function write(str) { document.write(str + '&l ...
- JS原生第七篇 (帅哥)
1.1 复习 offset 自己的 偏移 offsetWidth 得到自己的宽度 offsetHeight 构成 : width + padding + border div ...
- js 获取元素在页面上的偏移量的最佳方式
使用js制作效果时,我们常常要获取某个元素在页面上的偏移量(例如tip提示框功能).而获取偏移量可以直接获取相对于document的偏移量,也可以获取相对与视口的偏移量(viewpoint)加上页面滚 ...
- Top值
业务开发中经常会用到元素或者浏览器窗口的各种top值,最近开发组件的过程中也遇到各种问题,因此决定好好总结一下. 常见的top值 scrollTop Element.scrollTop 属性可以获取或 ...
- Javascript中与Scroll有关的方法
这块确实太乱了,被兼容搞的简直快要晕死,默默地总结下... 与scroll相关的方法 4个window对象下:scrollX.scrollY.scrollTo.scroll(作用和scrollTo一样 ...
随机推荐
- 巧学DBhelper
这几天在教我很重要的人学习,她属于那种超级小白,很超级的那种. 教她的过程中 发现有的知识点 不管这么教都不会.DBhelper就是不知道怎么记. 当时我就想到 杰哥(程杰)的出的大话系列,和他写书的 ...
- 前端面试题:css相关面试题
CSS 选择器中,元素选择器和类选择器的区别是什么? 元素选择器是最常见的 CSS 选择器,即,文档的元素就是最基本的选择器.选择器通常是某个 HTML 元素,比如 <p>.<h1& ...
- 十六、Hadoop学习笔记————Zookeeper实战
所有服务器都会先将自己的服务器信息注册到servers中,然后每台服务器都会尝试注册master,哪台注册成功,则哪台就是master服务器. 所有的服务器都会关注master节点的删除事件,这样通过 ...
- js-引用类型-Array
1.数组的操作方法 <html> <meta http-equiv="content-type" charset="utf-8" /> ...
- scrapy初试水 day03(递归调用)
import scrapyfrom scrapy.http import Requestfrom scrapy.spider import Rulefrom scrapy.linkextractors ...
- Failed to load the JNI shared lib...
启动eclipse报错:Failed to load the JNI shared lib... 解决办法如下:保证JDK与eclipse相匹配 在同一台计算机中,如果JDK是32位的,那么eclip ...
- bootstrap fileinput上传返回400,404,500 等错误替换
$(".uploadfile").on('filebatchuploaderror', function(event, data, msg) { $(".file-err ...
- html5 实现 文件夹上传
先插个背景:最近所在项目有个小需求,就是上传文件要可以同时选择文件夹及文件,然后把文件夹内得文件及所选单文件全部选择上传,借助于搜索关键词没搜到想要的结果(相关文章貌似很好,要么就是遍历文件夹内的文件 ...
- 负载均衡之 nginx
什么是负载均衡负载均衡(Load Balance)是分布式系统架构设计中必须考虑的因素之一,它通常是指,将请求/数据[均匀]分摊到多个操作单元上执行,负载均衡的关键在于[均匀].在使用nginx负载均 ...
- 网页设计——7.css的入门
css的介绍 div+css的设计: 什么是div? 理解示意图: 实例操作: 这里就要用到div+css的布局操作 先写一个html文件,见下图: <html><head>& ...