如何检测不同的scrollTop位置

Question

我想检测不同的大于 scrollTop 的位置，如下所示：如果窗口大于 100 像素，我想向 body 添加一个类，如果它再次大于 150，则删除该类并添加另一个类。

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

它仅适用于（如果条件），但不能通过使用（其他条件）处理多个位置。

Answer 1

您的问题是基本控制流，您的第二个条件是多余的，因为如果滚动 >= 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 (...