导航跟随,是目前制作网站模板所必须的,
//导航跟随 $(function(){ var nav=$("#nav-header"); var win=$(window); var sc=$(document); win.scroll(function(){ if(sc.scrollTop()>=110){ nav.addClass("fixednav"); $(".navTmp").fadeIn(); }else{ nav.removeClass("fixednav"); $(".navTmp").fadeOut(); } }) });
HTML:
<div id="nav-header" class="navbar"> <ul class="nav"> <li><a href="#">首页</a></li><li><a href="#">首页</a></li> <li><a href="#">首页</a></li><li><a href="#">首页</a></li> </ul> </div>
CSS:
.fixednav {position: fixed;top: 0;z-index: 265;width: 100%;opacity: .95;}
以上演示代码来源于李洋博客。
浏览器置顶/固定跟随可以用在导航菜单或者侧栏广告位等地方。