Javascript 带有滚动侦听器的SetTimeout方法

我有一个eventListener（“scroll”）函数，当用户向下滚动25px时，它会触发一个类。如果用户不执行任何操作，则永远不会触发该类。如果用户从不滚动，我如何设置超时函数在5秒后触发类

window.addEventListener("scroll", (e) => {
  let sat = document.querySelector(".hero-images--sat");
  let scrolled = window.pageYOffset;
  const images = document.querySelectorAll(".hero-image");

  if ((scrolled += 25)) {
    sat.classList.add("appear");
  }
  for (let i = 0; i < images.length; i++) {
    let pos = scrolled * images[i].dataset.rate;

    if (images[i].classList.contains("hero-images--earth")) {
      let pos = scrolled * images[i].dataset.rate - 48.75;
      images[i].style.transform = `translate3d(-50%, ${pos}%, 0px)`;
    } else {
      images[i].style.transform = `translate3d(0%, ${pos}%, 0px)`;
    }
  }
});

.appear {
    opacity: 1;
    transition: all 0.3s linear;
    top: 50%;
}

window.addEventListener（“滚动”），即（e）=>{
让sat=document.querySelector（“.hero images--sat”）；
让滚动=window.pageYOffset；
const images=document.queryselectoral（“.hero image”）；
如果（（滚动+=25））{
sat.classList.add（“出现”）；
}
for（设i=0；i

您可以在用户滚动后清除超时。看看这个：

滚动25px后，将调用

addClass（）

。如果不滚动，5秒后将调用它

函数addClass（）{
让sat=document.querySelector（“.hero images--sat”）；
sat.classList.add（“出现”）；
}
let timer=setTimeout（addClass，5000）；
window.addEventListener（“scroll”，（e）=>{
让滚动=window.pageYOffset；
如果（滚动>=25）{
清除超时（计时器）；
addClass（）；
}
});
p{
高度：100px；
}
.出现{
背景：红色；
}
foo

英雄形象——sat“>foo

福

福

福

福

福

foo
谢谢！这很有效。不过有一个小问题，滚动5秒后，滚动开始冻结一秒钟。你知道这是为什么吗？@RRhodes这种情况是只发生在你的代码中，还是也发生在我的示例中？无法在后者中复制。只能在我的代码中复制，抱歉。在实际的项目中还有很多事情要做。在不知道其余代码的情况下，我无法在这方面帮助您。很抱歉如果你能提供一个答案，也许你会为此提出一个新问题。