2012-05-28 4 views
11

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

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?

ответ

15

Пробуйте использовать 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); 

Example fiddle

Смежные вопросы