微信

javascript 滚动条下拉导航fixed

<!doctype html>

<html>
<style>
    body{
        margin:0;
        padding:0;    
    }
    #top{
        background:#000;
        width:400px;
        height:30px;
        
    }
    .a{
        position:fixed;
        top:0;
        left:0;
    }

</style>
    <body>
        <div style="height:300px;width:100%;background:#ccc;">
        </div>
        <div id="top">
        </div>
        <div style="height:1900px;">
        </div>
    
        <script>
        window.onscroll=function(){
        var t = document.documentElement.scrollTop || document.body.scrollTop;  
        var Otop =    document.getElementById('top');
            if(t > 300){
                var A = Otop.offsetHeight+Otop.offsetTop;
                Otop.style.position='fixed';
                Otop.style.left='0';
                Otop.style.top='0';
            }else{
                Otop.style.position='';
            }
        }

        
        </script>
    
    </body>
</html>

 

posted @ 2014-11-23 16:09  Admin_info  阅读(233)  评论(0编辑  收藏  举报
青春时代是一个短暂的美梦,当你醒来时,这早已消失得无影无踪了。
点点Admin_info