1、jQuery – 多个菜单导航滚动跟随，全部积累固定在顶端
2、jQuery 智能判断跟随页面滚动的导航、菜单、广告，下拉后跟随置顶特效代码
3、jQuery 导航菜单、广告 —— 固定、置顶、跟随
今天再来分享一个：
jquery swipeleft无效，jquery 斜体，jquery招聘面试题，jquerysteps，jquerymobile的cmd规范，jquery插件手风琴，jquery 架构，jquery判断颜色样式值，jquery读取地址栏id，jquery swipeleft无效
这个实现方法也是比较简单，都采用jquery：
<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<title>jquery实现导航栏置顶跟随窗口滚动</title>
<scriptsrc="http://apps.bdimg.com/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的方法！