Javascript 类列表和滚动事件

我有一些简单的脚本，可以根据

pageYOffset

向导航栏添加类：

  var navContainer = document.querySelector('.nav-container');
  var firstTitle = document.querySelector('.first-title')
  document.addEventListener('scroll',function(){
      if(window.pageYOffset < 75){
          navContainer.classList.remove('nav-action','yellow');
      }else if(window.pageYOffset > 75){
          navContainer.classList.add('nav-action')
      }else if(window.pageYOffset<firstTitle.offsetTop){
          navContainer.classList.remove('yellow');
      }
      else if(window.pageYOffset > firstTitle.offsetTop){
          navContainer.classList.add('yellow');
      };  
    });

var-navContainer=document.querySelector（'.nav-container'）；
var firstTitle=document.querySelector（“.first title”）
document.addEventListener（'scroll'，function（）{
如果（window.pageYOffset<75）{
navContainer.classList.remove（'nav-action'，'yellow'）；
}否则如果（window.pageYOffset>75）{
navContainer.classList.add（'nav-action'）
}else if（window.pageYOffset firstTitle.offsetTop）{
navContainer.classList.add（'yellow'）；
};  
});

---

我的问题是，当

window.pageYOffset

大于

firstTitle.offsetTop

时，最后一个条件被满足，在控制台的括号之间写这行返回true，但当我尝试所有代码时不会发生任何事情。

除非

window.pageYOffset==75

，这些行实际上都不会执行。以前的条件已经涵盖了所有情况

  var navContainer = document.querySelector('.nav-container');
  var firstTitle = document.querySelector('.first-title')
  document.addEventListener('scroll',function(){
      if(window.pageYOffset < 75){
          navContainer.classList.remove('nav-action','yellow');
      }else if(window.pageYOffset > 75){
          navContainer.classList.add('nav-action')
      }else if(window.pageYOffset<firstTitle.offsetTop){
          navContainer.classList.remove('yellow');
      }
      else if(window.pageYOffset > firstTitle.offsetTop){
          navContainer.classList.add('yellow');
      };  
    });

我建议分别处理

导航动作

和

黄色

：

  var navContainer = document.querySelector('.nav-container');
  var firstTitle = document.querySelector('.first-title')
  document.addEventListener('scroll',function(){
      if(window.pageYOffset < 75){
          navContainer.classList.remove('nav-action','yellow');
      }else if(window.pageYOffset > 75){
          navContainer.classList.add('nav-action')
      }else if(window.pageYOffset<firstTitle.offsetTop){
          navContainer.classList.remove('yellow');
      }
      else if(window.pageYOffset > firstTitle.offsetTop){
          navContainer.classList.add('yellow');
      };  
    });

var navContainer = document.querySelector('.nav-container');
var firstTitle = document.querySelector('.first-title')
document.addEventListener('scroll', function() {
    if (window.pageYOffset < 75) {
        navContainer.classList.remove('nav-action');
    } else {
        navContainer.classList.add('nav-action')
    }

    if (window.pageYOffset < firstTitle.offsetTop) {
        navContainer.classList.remove('yellow');
    } else {
        navContainer.classList.add('yellow');
    }
});

var-navContainer=document.querySelector（'.nav-container'）；
var firstTitle=document.querySelector（“.first title”）
document.addEventListener（'scroll'，function（）{
如果（window.pageYOffset<75）{
navContainer.classList.remove（'nav-action'）；
}否则{
navContainer.classList.add（'nav-action'）
}
if（window.pageYOffset

你会用jQuery吗？不会，因为我想学Vaniliah，好吗。好的。@ArturArczi很高兴能帮上忙！你可能想