1、jQuery – 多个菜单导航滚动跟随，全部积累固定在顶端
2、jQuery 智能判断跟随页面滚动的导航、菜单、广告，下拉后跟随置顶特效代码
3、jQuery 导航菜单、广告 —— 固定、置顶、跟随
今天再来分享一个：
这个实现方法也是比较简单，都采用jquery：
<!doctypehtml><html><head><metacharset="utf-8"><title>jquery实现导航栏置顶跟随窗口滚动</title><scriptsrc="/libs/jquery/2.1.4/jquery.js"></script><style>*{margin:0;padding:0;text-align:center;}.mainavi{text-align:center;}</style></head><body><br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<divclass="mainavi">222222222222222</div><br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<script>(function($){$.fn.smohanfixednav=function(mtop,zindex){varnav=$(this),isIE6=undefined==typeof(document.body.style.maxHeight),mtop=mtop,zindex=zindex,dftop=nav.offset().top-$(window).scrollTop(),dfleft=nav.offset().left-$(window).scrollLeft(),dfcss=newArray;dfcss[0]=nav.css("position"),dfcss[1]=nav.css("top"),dfcss[2]=nav.css("left"),dfcss[3]=nav.css("zindex"),$(window).scroll(function(e){$(this).scrollTop()>dftop?isIE6?nav.css({position:"absolute",top:eval(document.documentElement.scrollTop),left:dfleft,"z-index":zindex}):nav.css({position:"fixed",top:mtop+"px",left:dfleft,"z-index":zindex}):nav.css({position:dfcss[0],top:dfcss[1],left:dfcss[2],"z-index":dfcss[3]})})}})(jQuery)</script><scripttype="text/javascript">$(document).ready(function(e){$(.mainavi).smohanfixednav(0,999);});</script></body></html>
这个实现导航菜单跟随窗口的方法，需注意CSS变化，JS中采用了position的方法！
