Придерживание Div к вершине после прокрутки Прошлое

Прямо сейчас, я могу придерживать div до вершины после прокрутки вниз 320px, но я хотел знать, есть ли другой способ достижения этого. Ниже у меня есть код:

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();
});

он работает, но некоторые divs над ним не всегда будут одинаковой высоты, поэтому я не могу полагаться на 320px. Как мне заставить это работать без использования if ($(window).scrollTop() > 320), чтобы я мог заставить его затухать вверху после того, как пользователь прокручивается мимо div #navwrap?

Ответы

Ответ 1

Попробуйте использовать offset().top элемента #navwrap. Таким образом, элемент будет фиксирован из исходной позиции в документе, независимо от того, где это. Например:

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);

Пример скрипта