使用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兼容处理的更多相关文章

  1. input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年，我们被耍过的bug——has

    input屏蔽历史记录   设置input的扩展属性autocomplete 为off即可 ;function($,undefined) 前面的分号是什么用处   ;(function($){$.ex ...

  2. 获取scrollTop兼容各浏览器的方法，以及body和documentElement

    1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 : 对于有do ...

  3. 【转】获取scrollTop兼容各浏览器的方法，以及body和documentElement是啥？

    1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 : 对于有do ...

  4. 关于scrolltop 兼容 IE6/7/8, Safari,FF的方法

    1.各浏览器下 scrollTop的差异IE6/7/8:对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 :对于有docty ...

  5. document.body.scrollTop与document.documentElement.scrollTop兼容

    这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声 ...

  6. onsrcoll和scrollTop兼容与实现

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

  7. scrollTop兼容封装

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  8. scrollTop 值为 0

    由scrollTop兼容问题引起: 在 Firefox 和 IE 中,使用 document.documentElement.scrollTop 获取: 在 Chrome 中,使用 document. ...

  9. js，jQuery实现可关闭悬浮框广告特效，兼容（谷歌，火狐，Ie）

    注意不能直接用close()命名关闭广告函数,避免冲突. javascript实现方法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr ...

随机推荐

  1. JDK 中的监控与故障处理工具-05 (jstack)

    jstack : stack trace for java jstack 命令用于生成虚拟机当前时刻的线程快照 (threaddump).线程快照是当前虚拟机中每一条线程正在执行的方法堆栈的集合,生成 ...

  2. Nodejs V8引擎 fast property lookup

    前言 之所以会研究这个东西,是我在网上找了一下各个语言的执行效率比较.好吧,我承认这是个无聊的东西,不过看看总是无妨,然而我惊讶的发现,有些测试声称Java,C,Nodejs是处在同一个效率级别参见链 ...

  3. iView--3

    项目基本结构 简单介绍目录 build目录是一些webpack的文件,配置参数什么的,一般不用config是vue项目的基本配置文件node_modules是项目中安装的依赖模块src源码文件夹,基本 ...

  4. gitlab 去除代码保护

  5. iOS 可变字符串NSMutableString的使用

    .创建一个可变字符串 NSMutableString * ms1 = [[NSMutableString alloc]init]; .可以通过类方法来创建 NSMutableString * ms2 ...

  6. 基础系列（1）之干掉JavaScript变量作用域

     今天去某顺公司面试,发现一些基础知识都不记得了,于是乎决定把js基础系列的全部梳理一遍,今天就整理下js变量作用域的相关基础知识点,配合最常遇到的笔试题阐述. 题一: var g = "a ...

  7. Excel_To_DataTable

    /// <summary> /// Read data in excel file to datatable /// </summary> /// <param name ...

  8. day19 Models补充+缓存+信号+序列化+分析抽屉页面

    参考链接: http://www.cnblogs.com/wupeiqi/articles/5237704.html http://www.cnblogs.com/wupeiqi/articles/5 ...

  9. 【Raspberry Pi】USB无线网卡自动连接

    Raspberry Pi 使用USB无线网卡的时候不会因为路由重启而掉线. #!/bin/bash while true ; do if ifconfig wlan0 | grep -q " ...

  10. mysql 5.1.71升级到5.6.30

    mysql 5.1.71升级到5.6.30 mysqldump -h主机名 -P端口 -u用户名 -p密码 (–database) 数据库名 > 文件名.sql 备份MySQL数据库的命令 my ...