jQuery教學－畫面上下滑動到指定區塊

梅干 2011/07/14 1 分鐘閱讀

　　自從好友男丁格爾改版後，網站中陸續出現一些有趣的小東西，而最令梅干喜好的就是那側邊選單，點一下就可快速將畫面帶到指定的區塊中，例如說置頂、留言、置底部，只要點下右邊的小圖示按鈕，畫面就會上下滑動到剛所點選的區塊中，早期在HTML中就可用錨點來快速跳到指定區塊中，但常會發生一種情況，一點跳過頭的現象，現在透過jQuery不但可準準的到指定區塊中，且還有動態的效果。

Step1
語法很簡單，.click前方是選單的ID名稱，然後.offset()前方是區塊名稱，800那是滑動的速度，數字愈大滑動愈慢，若有N個時，只要一直不斷的複製下方的語法，並更改按鈕與區塊名稱就可以了。

$(‘#按鈕名稱‘).click(function(){
$(‘html,body’).animate({scrollTop:$(‘#指定區塊塊名稱‘).offset().top}, 速度);
}); //代表一個完整的執行區塊

梅問題-jQuery上下滑動到指定區塊