1. 程式人生 > >天貓,京東各大網站錨點的跳轉

天貓,京東各大網站錨點的跳轉

// 點選導航

<div class="left_bar" style="">

<a class="bar_one" href="#s_1">
<span class="bar_span">網店</span>
<span class="bar_span2">裝修</span>
</a>
<a class="bar_two" href="#s_2">
<span class="bar_span">首頁</span>
<span class="bar_span2">裝修</span>
</a>
<a class="bar_three" href="#s_3">
<span class="bar_span">詳情</span>
<span class="bar_span2">裝修</span>
</a>
<a class="bar_four" href="#s_4">
<span class="bar_span">活動</span>
<span class="bar_span2">裝修</span>
</a>
<a class="bar_five" href="#s_5">
<span class="bar_span">海報</span>
<span class="bar_span2">裝修</span>
</a>
<a class="bar_six" href="#s_6">
<span class="bar_span">其它</span>
<span class="bar_span2">需求</span>
</a>

</div>

// 跳轉的目的地

<div  id=''s1"></div>

<div  id=''s2"></div>

<div  id=''s3"></div>

<div  id=''s4"></div>

<div  id=''s5"></div>

<div  id=''s6"></div>

/*錨點的滑動效果*/
$(".left_bar > a").click(function() {
$("html, body").stop(true,false).animate({
scrollTop: $($(this).attr("href")).offset().top +"px"
}, {
duration: 500,
easing: "swing"
});
return false;
});