像change.org上的花式快速滾動

Question

如果您閱讀change.org上的請願書，您可以在右上方選擇一個CSS/html動畫滾動條。 div類被命名爲快速滾動。我在網上搜索它，但沒有找到任何東西。

你知道代碼片段或例子如何包括這樣一個很好的快速滾動到你自己的主頁？我感謝您的幫助！ :)

Answer 1

我猜你喜歡scrollTo的東西？

http://flesler.com/jquery/scrollTo/

你也可以使用jQuery無需插件。 只需使用錨，滾動到一個預定義的DIV，比如你有這樣的菜單：

<ul class="nav"> 
<li><a href="#area-a">Option A</a></li> 
<li><a href="#area-b">Option B</a></li> 
<li><a href="#area-c">Option C</a></li> 
</ul> 

內容是這樣的：

<div id="area-a"></div> 
<div id="area-b"></div> 
<div id="area-c"></div> 

的jQuery：

jQuery('ul.nav a').bind('click',function(event){ 
var $anchor = jQuery(this); 

jQuery('html, body').stop().animate({ 
    scrollTop: jQuery($anchor.attr('href')).offset().top - 60 }, 
    1500, 'easeInOutExpo'); 
    event.preventDefault(); 
    }); 
});