So verwenden Sie den Link , um zu einem bestimmten Teil der Seite zu scrollen

Mit dem Aufkommen einseitiger Websites ist die Nutzung des Scrollens als Methode zum Navigieren auf langen Seiten immer beliebter geworden. Dieser kleine Teil ist in JS + jQuery-Code implementiert und Sie können problemlos Links in Navigationselementen setzen, um zum entsprechenden Teil der Seite zu scrollen. Wenn Sie möchten, dass das Anker-Tag zur Seite hinzugefügt wird, wenn JS nicht vorhanden ist.

Kaffeeskript:

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

oder JS:

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

und einige Beispiel-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>

Das obige ist der detaillierte Inhalt vonSo verwenden Sie den Link , um zu einem bestimmten Teil der Seite zu scrollen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!