实战中运用到，mark下来
//定位导航栏
$(document).scroll(function(){
var $top = parseInt($(window).scrollTop());
if($top>=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 = $(this).attr("href"); //所得href即跳转到目的元素的选择器
var $pos = $($href).offset().top; //这里要换算的话记得用number()转换成数字
$("html,body").animate({ scrollTop:$pos}, 40);
});
});
滚动到相应的地方相应的锚点高亮
//滚动到指定位置，对应锚点自动高亮
$(window).scroll(function(){
var $wst = $(window).scrollTop();
var $cts_top = $("#cho_cts").offset().top-80;
var $addr_top = $("#cho_serAddr").offset().top-80;
var $time_top = $("#forSf_info").offset().top-80;
var $sub_top = $("#xiadan_submit_box").offset().top-80;
if($cts_top<=$wst){
$(".stepBars a").removeClass("on").eq(0).addClass("on");
}
if($addr_top<=$wst){
$(".stepBars a").removeClass("on").eq(1).addClass("on");
}
if($time_top<=$wst){
$(".stepBars a").removeClass("on").eq(2).addClass("on");
}
if($sub_top<=$wst){
$(".stepBars a").removeClass("on").eq(3).addClass("on");
}
});
逐个逐个来显得有点笨拙，有空研究下怎样遍历执行
转播
