分享好友 服务中心首页 服务中心分类 切换频道

分享个导航栏悬浮的代码,很有用的哦~~~

2013-09-09 18:450yao建材之家学院
在头部导航栏的代码<div class="menu">的上面加上代码:

<!--导航悬浮-->
<style type="text/css">
.navontop{position:fixed;top:25px;margin-left:auto;margin-right:auto;width:980px;z-index:999;}</style>
<script type="text/javascript">
jQuery(document).ready(function(){
    var navtop=jQuery("#nv").offset().top;
    jQuery(window).scroll(function(){
        var temp=jQuery(this).scrollTop();
        if(temp>navtop)
            jQuery("#nv ").addClass("navontop ");
        else
            jQuery("#nv ").removeClass("navontop ");
    });
});</script>



然后在div里面加上一个 id="nv"  如下:

<div id="nv" class="menu">

同理也可以在文章内容的右侧加上悬浮的内容,使比较长的文章右侧不会变得那么多的空白。详情请参考网站https://m.jc68.com/
点赞 0
举报
收藏 0
打赏 0
评论 0
分享 70
更多相关评论
暂时没有评论,来说点什么吧