导航栏滚动到顶部后固定


导航栏滚动到顶部后固定

http://blog.csdn.net/moqiang02/article/details/17995033

<div style="height:500px;background:#999"></div>  
<div id="fixedMenu" style="background:#eee;width:100%;">MENU</div>  
<div style="height:1900px;background:#999"></div>  
<script type="text/javascript" src="http://www.coding123.net/js/jquery.js"></script>  
<script type="text/javascript">  
    $(function () {  
        var ie6 = /msie 6/i.test(navigator.userAgent)  
        , dv = $('#fixedMenu'), st;  
        dv.attr('otop', dv.offset().top); //存储原来的距离顶部的距离  
        $(window).scroll(function () {  
            st = Math.max(document.body.scrollTop || document.documentElement.scrollTop);  
            if (st >= parseInt(dv.attr('otop'))) {  
                if (ie6) {//IE6不支持fixed属性,所以只能靠设置position为absolute和top实现此效果  
                    dv.css({ position: 'absolute', top: st });  
                }  
                else if (dv.css('position') != 'fixed') dv.css({ 'position': 'fixed', top: 0 });  
            } else if (dv.css('position') != 'static') dv.css({ 'position': 'static' });  
        });  
    });  
      
</script> 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM