滚动到一定高度就固定（fixed）导航栏

实战中运用到&＃xff0c;mark下来

//定位导航栏$(document).scroll(function(){var $top &＃61; parseInt($(window).scrollTop());if($top>&＃61;139){$(".stepBars").css({"position":"fixed","top":0,"z-index":5});}else{$(".stepBars").css({"position":"absolute","top":135,"z-index":5});}});


给导航栏的锚点功能添加动画效果

$(".stepBars a").each(function(index){ //遍历导航栏的a标签$(this).bind("click",function(){var $href &＃61; $(this).attr("href"); //所得href即跳转到目的元素的选择器var $pos &＃61; $($href).offset().top; //这里要换算的话记得用number()转换成数字$("html,body").animate({ scrollTop:$pos}, 40); });});


滚动到相应的地方相应的锚点高亮

//滚动到指定位置&＃xff0c;对应锚点自动高亮$(window).scroll(function(){var $wst &＃61; $(window).scrollTop();var $cts_top &＃61; $("#cho_cts").offset().top-80;var $addr_top &＃61; $("#cho_serAddr").offset().top-80;var $time_top &＃61; $("#forSf_info").offset().top-80;var $sub_top &＃61; $("#xiadan_submit_box").offset().top-80;if($cts_top<&＃61;$wst){$(".stepBars a").removeClass("on").eq(0).addClass("on");}if($addr_top<&＃61;$wst){$(".stepBars a").removeClass("on").eq(1).addClass("on");}if($time_top<&＃61;$wst){$(".stepBars a").removeClass("on").eq(2).addClass("on");}if($sub_top<&＃61;$wst){$(".stepBars a").removeClass("on").eq(3).addClass("on");}});


逐个逐个来显得有点笨拙&＃xff0c;有空研究下怎样遍历执行