根據hash值 滑動到指定位置以及樓層效果

根據hash值 滑動到指定位置
eg：

<a href="#page2">page2</a> 
<div  id="page1">page1</div> 


nav.find("a[href^='#']").click(function(e){ 
    e.preventDefault(); 
    $('html, body').animate({scrollTop: $(this.hash).offset().top}, 400); 
}); 

樓層效果
html

	<!--banner部分-->
	<div class="banner_one banner" id="floor1">我是樓層1</div>
	<div class="banner_two banner" id="floor2">我是樓層2</div>
	<div class="banner_three banner" id="floor3">我是樓層3</div>
	<div class="banner_four banner" id="floor4">我是樓層4</div>
	<div class="banner_five banner" id="floor5">我是樓層5</div>
	<div class="banner_six banner" id="floor6">我是樓層6</div>
	<div class="footer">我是底部</div>
	<!--樓層部分-->
	<div class="floor">
		<ul>
			<li><a href="#floor1">1</a></li>
			<li><a href="#floor2">2</a></li>
			<li><a href="#floor3">3</a></li>
			<li><a href="#floor4">4</a></li>
			<li><a href="#floor5">5</a></li>
			<li><a href="#floor6">6</a></li>
		</ul>
	</div>

js

//			第一種點擊li元素到相應的樓層的方法,可以直接用錨點的方式,然後加上點擊後的效果			
//			$(".floor li").click(function(){
//				$(this).addClass("active").siblings().removeClass("active")
//			})
			
//			第二種點擊li元素到相應的樓層的方法，錨點要去掉
			var flag = true //設置標識。防止出現跑馬燈
			$(".floor li").click(function(){
				flag = false
				$(this).addClass("active").siblings().removeClass("active")
				var index = $(this).index()//獲取當前點擊元素的索引
				var top = $(".banner").eq(index).offset().top;//獲取每個banner到頂部的距離
				$("html,body").stop(true).animate({"scrollTop":top},function(){flag = true})
			})
			
//			滾輪滑動切換樓層
			$(window).scroll(function(){
				if(flag){
				//瀏覽器可視窗口的一半，也可以根據自己需求設定
					var winH = $(window).innerHeight()/2;
					var scrollT = $(window).scrollTop()
					var len = $(".banner").size()
					for(var i=0;i<len;i++){
						//注意這裏banner對象加了i之後變成了js對象,所以用offsetTop
						var bannerGap = $(".banner")[i].offsetTop - scrollT
						if(bannerGap < winH){
							$(".floor li").eq(i).addClass("active").siblings().removeClass("active")
						}
					}
				}
			})