如何实现下拉到第二屏才显示返回顶部按钮

忽然想到可以用absolute定位到屏幕外，拉到那里之后再用fixed.可以吗？

解决方案 »

  1.   

    没有做过,但是有一个想法
    在onscroll事件中,计算document的scrollTop是否大于一屏的高度,如果大于一屏就显示回到顶部
      

  2.   

    自己试了一下,好像可以.
    <html>
    <head>
        <style>
            body
            {
                margin: 0px;
                padding: 0px;
            }
        </style>    <script type="text/javascript" src="jquery/jquery.js"></script>    <script type="text/javascript">
            $(document).ready(function(){           
               for(var i =0 ; i < 100 ; i++){
                 $(document.body).append("<p>line "+i+"</p>");
               }           
           });
           
            $(window).scroll( function() { 
               if($(document).scrollTop() >= document.body.clientHeight){
                $("#dvTopC").css("top",$(document).scrollTop()).show();
               }
               else{
                $("#dvTopC").hide();
               }
            });    
        </script></head>
    <body>
        <a name='top'></a>
        <div id="dvTopC" style="right: 5px; position: absolute; background-color: #efe; border: solid 1px red;
            display: none;">
            <a href="#top">回到顶部</a>
        </div>
        <p>
            到第二页高度时,出现回到顶部</p>
    </body>
    </html>