jquery编写兼容IE6的返回顶部功能

来源:互联网 发布:交大知行大厦招聘 编辑:程序博客网 时间:2024/06/05 06:34
<pre name="code" class="html"><!DOCTYPE html><html><head>    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">    <title>无标题文档</title>    <style type="text/css">* html{    background-image:url(about:blank);    background-attachment:fixed;    }/*解决IE6固定定位在平面滚动时闪烁*/     body,div{padding:0; margin:0; border:0;}    .con{ margin:0 auto; width:1000px; height:2000px; background-color:#F00;}    .home{ width:1000px; margin:0 auto;}    .btn{ position:fixed; margin-left:50%; top:500px; left:500px; width:50px; height:50px; background-color:#0FF;    <pre code_snippet_id="283988" snippet_file_name="blog_20140409_1_9537939" name="code" class="html">/*解决IE6不支持固定定位*/ _position:absolute;    _top: expression(eval(document.documentElement.scrollTop-200+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))); _bottom:auto; display:none;}    </style>    <script src="jquery-1.8.3.min.js" type="text/javascript"></script>    <script type="text/javascript">        $(document).ready(function(e) {var timer=setInterval(goto,500);        //ie6不支持$(document).scroll方法,用定时器解决        function goto(){            if($(window).scrollTop()>200){                $(".btn").show();                             }else{ $(".btn").hide(); } };            $(".btn").click(function(e) { $("html,body").animate({scrollTop:0},1000); });})    </script></head><body>    <div class="con"></div>    <div class="btn"></div>    <pre></pre></body></html>


                                             
0 0