jQuery Scrollen zum Abschnitt der Seite

Question

Ich versuche, eine neue trendige einseitige Website zu erstellen, wo ich zu einem Abschnitt auf der Seite blättern. Ich möchte den "fixed" Header genau dorthin bringen wo der Inhalt ist. Ich benutze die Zurb-Stiftung. Das ist, was ich habe bisher (ein Teil des Codes hier):

<li><%= link_to "Recent Work", "#", "data-scroll" => "recent" %></li> 

    $(document).ready(function() { 
$("a[data-scroll]").click(function() { 
    var id = $(this).data("scroll") 
    $('html,body').animate({ 
      scrollTop: $("#"+id).offset().top}, 
     'slow'); 
}); 
}); 

    <div id="recent">some content</div> 

Problem ich habe, ist oben angegeben. Ich möchte meinen festen Header genau dorthin bringen, wo dieses div auf der Seite platziert ist. Bitte beraten.

Answer 1

There's a plugin for that.

Or just roll your own.

Wenn Sie die "roll your own" Lösung dann versuchen Sie Folgendes ausgeglichen:

$("#button").click(function() { 
    var offset = 20; //Offset of 20px 

    $('html, body').animate({ 
     scrollTop: $("#elementtoScrollToID").offset().top + offset 
    }, 2000); 
});