scrollTop兼容处理
使用jQuery2.0以下版本的scrollTop()函数来设置当然兼容性当然很好,但有时需要为滚动设置滑动效果。比如，使用animate函数，这里需要做些兼容性处理：
实例：http://sandbox.runjs.cn/show/pji9exa3
代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
<script src="http://sandbox.runjs.cn/uploads/rs/294/c4c2o6mh/jquery.js"></script>
</head>
<body style="height: 1000px;">
<input type="button" value="使用jQuery的scrollTop()" id="sr" />
<input type="button" value="使用animate()加入动画" id="sc" />
<input type="button" value="使用css()来设置" id="st" />
<script type="text/javascript">
//设定滚动条与顶部的距离兼容处理
var getScrollObj = function(){
var obj = null;
if (navigator.userAgent.indexOf('Firefox') >= 0 || navigator.userAgent.indexOf('MSIE')>=0 )//firefox特殊处理,木有动画效果
obj = $(document.documentElement);
else
obj = $('body');
return obj;
}; $('#sr').click(function(){
getScrollObj().scrollTop(100);
});
$('#sc').click(function(){
getScrollObj().animate({'scrollTop': '300px'},1000);
});
</script>
</body>
</html>
scrollTop兼容处理的更多相关文章
- input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年，我们被耍过的bug——has
input屏蔽历史记录 设置input的扩展属性autocomplete 为off即可 ;function($,undefined) 前面的分号是什么用处 ;(function($){$.ex ...
- 获取scrollTop兼容各浏览器的方法，以及body和documentElement
1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 : 对于有do ...
- 【转】获取scrollTop兼容各浏览器的方法，以及body和documentElement是啥？
1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 : 对于有do ...
- 关于scrolltop 兼容 IE6/7/8, Safari,FF的方法
1.各浏览器下 scrollTop的差异IE6/7/8:对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 :对于有docty ...
- document.body.scrollTop与document.documentElement.scrollTop兼容
这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声 ...
- onsrcoll和scrollTop兼容与实现
对于onscroll事件的支持 各浏览器 document.document.body.document.documentElement 对象的 onscroll 事件的支持存在差异. 所谓的支持性存 ...
- scrollTop兼容封装
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- scrollTop 值为 0
由scrollTop兼容问题引起: 在 Firefox 和 IE 中,使用 document.documentElement.scrollTop 获取: 在 Chrome 中,使用 document. ...
- js，jQuery实现可关闭悬浮框广告特效，兼容（谷歌，火狐，Ie）
注意不能直接用close()命名关闭广告函数,避免冲突. javascript实现方法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr ...
随机推荐
- 51 Nod 1091 线段的重叠
2017-09-24 19:51:41 writer:pprp 上一个题目就是关于线段重叠最大值,这个是找区间最长重合? 给你n个线段,然后让你在其中选择两条,使两条尽可能重合多一点 解决方法; 1. ...
- npm install 报错 ECONNREFUSED
在window环境下,使用npm install 命令安装任何框架,都会报如下的错误 error code ECONNREFUSED error errno ECONNREFUSED error Fe ...
- BZOJ4767 两双手
本文版权归ljh2000和博客园共有,欢迎转载,但须保留此声明,并给出原文链接,谢谢合作. 本文作者:ljh2000 作者博客:http://www.cnblogs.com/ljh2000-jump/ ...
- iOS中的二维数组
首先我们知道OC中是没有二维数组的,二维数组是通过一位数组的嵌套实现的,但是别忘了我们有字面量,实际上可以和C/C++类似的简洁地创建和使用二维数组.这里总结了创建二维数组的两种方法以及数组的访问方式 ...
- CSS 左边div固定，右边div自适应
有时候我们会有这样的需求,如图,aside是导航或者某些链接,右边的main是显示重要的内容,左边需要定宽,右边的main能够自适应剩余的宽度: <!DOCTYPE html PUBLIC &q ...
- ctci1.8
bool isSub(string str0, string str1){ if(str0.length() != str1.length()) return false; ...
- MVVM中轻松实现Command绑定任意事件的Command
下面是“银光中国”(不错的WPF或SL网站)WPF学习教程中的一个连接, http://www.silverlightchina.net/html/study/WPF/2011/0715/9034.h ...
- vim 正则 捕获
在正规表达式中使用 \( 和 \) 符号括起正规表达式,即可在后面使用\1 \2等变量来访问捕获的内容. 将捕获内容前后交换,如下: :s/\(\haha\)\(hehe\)/\\/
- Mysql5.7-CentOS7安装
下载Mysql 官网地址,点击download,找到Community 选择MySQL Community Server 选择平台和版本下载即可 安装mysql 查看安装文档 在下载页面上面有安装指南 ...
- uva10766生成树计数
此类题是给定一个无向图,求所有生成树的个数,生成树计数要用到Matrix-Tree定理(Kirchhoff矩阵-树定理) G的度数矩阵D[G]是一个n*n的矩阵,并且满足:当i≠j时,dij=0:当i ...