首页 > 代码库 > scrollTop兼容处理

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="http://www.mamicode.com/使用jQuery的scrollTop()" id="sr" />    <input type="button" value="http://www.mamicode.com/使用animate()加入动画" id="sc" />    <input type="button" value="http://www.mamicode.com/使用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兼容处理