实现唯品汇导航页面固定在顶部

javascript：

.addClass():

.slideDown()手风琴效果向下：

js代码实现：

//设置一个flag
var down = false;

//监听页面滚动
$(window).scroll(function(){
	if($(this).scrollTop()>100){//如果向下滚动的距离大于100px 就固定导航栏在顶部
		$(".navBox").addClass("fixed"); //为导航栏添加一个class 名字 设置其position ：fixed z-index:99
		
		if(down==false){//让以下代码值执行一次
		$(".navBox").css("top","-43px");//固定导航栏位置在顶部，
		$(".navBox").animate({"top":"0px"},500);//动画效果
		down=true;
	}
	}
	
	else{
		$(".navBox").removeClass("fixed");
		down=false;
	}
});
$(".navBox .menu").mouseenter(function(){
	//手风琴效果向下
	$(".navBox .menu .downList").stop().slideDown(100,"linear");
});
$(".navBox .menu").mouseleave(function(){
	$(".downList").stop().slideUp(100,"linear");
});

效果展示：