如何使用nav連接實現滾動到頁面某一部分

隨着一頁網站的出現，使用滾動做爲導航長頁面的方法變得愈來愈流行。這一小部分是用JS + jQuery代碼實現的，您能夠輕鬆地在nav元素中設置連接以滾動到頁面的相應部分。若是您但願在JS不存在時將錨標記添加到頁面中。

Coffeescript：

$("nav").find("a").click (e) ->
    e.preventDefault()
    section = $(this).attr "href"
    $("html, body").animate
        scrollTop: $(section).offset().top

或JS：

$("nav").find("a").click(function(e) {
    e.preventDefault();
    var section = $(this).attr("href");
    $("html, body").animate({
        scrollTop: $(section).offset().top    });});

和一些示例HTML

<nav>
    <a href="#welcome">Welcome</a>
    <a href="#about">About</a>
    <a href="#section3">Section 3</a>
</nav>
<div id="welcome">Welcome to this website</div>
<div id="about">About this website, and such</div>
<div id="section3">The third section</div>

以上就是如何使用<nav>連接實現滾動到頁面某一部分的詳細內容，但願對你有所幫助。

閱讀原文：如何使用nav連接實現滾動到頁面某一部分

相關文章：
使用jQuery HTML5和FormData上傳文件的方法示例
淺談H5的data-*中容易被忽略的一個小問題
html5須要遵照的6個原則（介紹）
linux怎麼掛載
java能夠對map的key排序嗎