2015-01-14 3 views
0

Я пытаюсь добавить 2 класса в div, первое нужно добавить в точке WHEN scrolltop равно определенной сумме, вторая добавляется, если scrolltop больше определенной суммы.jQuery делать что-то, КОГДА происходит событие

Вот мой JQuery код:

var Scroll = $(window).scrollTop(); 
var ScrollFXfullHeight = $('.header-wrapper').height(); 

    if (Scroll == ScrollFXfullHeight) { 
     $("#navigation, .hidden_menu_link_container").addClass("fixed"); 
    } else if (Scroll > ScrollFXfullHeight) { 
     $("#navigation, .hidden_menu_link_container, .stop_the_jump").addClass("thinner"); 
    } 

выше решение, очевидно, использует 2, если заявления, проблема здесь в том, что страница должна в точности равна ScrollFXfullHeight для первого класса должны быть добавлены, однако, если вы просто быстро прокрутите его, тогда событие не будет запущено.

Есть ли способ сказать «КОГДА Scroll == ScrollFXFullHeight добавить класс», чтобы он делал это даже тогда, когда прокручивается прошлое?

+0

Не совсем, нет. Прокрутка только обновляется так же быстро, как позволяет поток браузеров'UI, поэтому есть пробелы в значении scrollTop. Конечно, логика здесь испорчена, так как когда-то запускается 'Scroll == ScrollFxFullHeight',' Scroll> ScrollFxFullHeight' будет true? –

ответ

1

Проверьте, не установлено ли ScrollScrollFXfullHeight, а затем проверьте, имеет ли ваш элемент класс fixed. Если нет, добавьте его:

if (Scroll >= ScrollFXfullHeight) { 
    if(!$("#navigation, .hidden_menu_link_container").hasClass('fixed')) { 
     $("#navigation, .hidden_menu_link_container").addClass("fixed"); 
    } 
    $("#navigation, .hidden_menu_link_container, .stop_the_jump").addClass("thinner"); 
} 

Таким образом, даже если пользователь прокручивает в прошлом, что точный момент, класс все равно будет добавлен, но добавляется лишь один раз. Я считаю, что вам, вероятно, следует также проверить, добавлен ли класс thinner, но это ваш звонок

+1

Это хорошая работа вокруг - спасибо –

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