Klepanie Div to Top Po przewijaniu Za nim

Question

W tej chwili jestem w stanie przykleić div do góry po przewinięciu w dół 320px, ale chciałem wiedzieć, czy jest inny sposób osiągnięcia tego. Poniżej mam kod:

jQuery(function($) { 
    function fixDiv() { 
     if ($(window).scrollTop() > 320) { 
      $('#navwrap').css({ 'position': 'fixed', 'top': '0', 'width': '100%' }); 
     } 
     else { 
      $('#navwrap').css({ 'position': 'static', 'top': 'auto', 'width': '100%' }); 
     } 
    } 
    $(window).scroll(fixDiv); 
    fix5iv(); 
}); 

to działa, ale niektóre divs nad nim nie będzie zawsze taka sama wysokość, więc nie mogę polegać na 320px. Jak mogę to uruchomić bez korzystania z if ($(window).scrollTop() > 320), dzięki czemu mogę go rozjaśnić na górze, gdy użytkownik przewinie numer użytkownika za ?

Answer 1

Spróbuj użyć elementu offset().top elementu . W ten sposób element zostanie poprawiony z jego początkowej pozycji w dokumencie, niezależnie od tego, gdzie jest. Na przykład:

function fixDiv() { 
    var $div = $("#navwrap"); 
    if ($(window).scrollTop() > $div.data("top")) { 
     $div.css({'position': 'fixed', 'top': '0', 'width': '100%'}); 
    } 
    else { 
     $div.css({'position': 'static', 'top': 'auto', 'width': '100%'}); 
    } 
} 

$("#navwrap").data("top", $("#navwrap").offset().top); // set original position on load 
$(window).scroll(fixDiv); 

Example fiddle