Как обнаружить разные позиции scrollTop

Я хотел бы обнаружить положение больше, чем scrollTop, следующим образом: я хочу, чтобы окно больше 100 пикселей добавляло класс в тело, а если оно снова больше 150, удаляло этот класс и добавляло другой класс.

$(window).scroll(function() {    
   var scroll = $(window).scrollTop();
   if (scroll >= 100)  {
      $('body').addClass('one');
   }
   else (scroll >= 150)  {
      $('body').addClass('two');
      $('body').removeClass('one')
   }
});

Он работает только с применением (если условие), но не работает с несколькими позициями с помощью (еще условие).

1 ответ

Решение

Ваша проблема - основной поток управления, ваше второе условное выражение избыточно, потому что если scroll>> 150, то это определенно>= 100, что означает, что вы никогда не достигнете этого второго блока:

if (scroll >= 100) {
    // execute if scroll is greater or equal to 100
} else if (scroll >= 150) {
    // execute if scroll is NOT greater or equal to 100
    // execute if scroll is greater or equal to 150
}

Вам нужно поменять их местами так:

if (scroll >= 150) {
    // execute if scroll is greater or equal to 150
} else if (scroll >= 100) {
    // execute if scroll is NOT greater or equal to 150
    // execute if scroll is greater or equal to 100
}

У вас также есть синтаксическая ошибка здесь: else (scroll >= 150) { должно быть else if (...

Другие вопросы по тегам