Функция прокрутки Javascript не работает

Я пытаюсь добавить class к id когда пользователь прокручивает последние 25 пикселей. Я не уверен, почему, но функция не срабатывает после школы. Любая помощь относительно того, почему будет принята с благодарностью. Вот мой код:

window.onscoll = function() {
  showArrow()
};

function showArrow() {
  if (document.body.scrollTop > 25 || document.documentElement.scrollTop > 25) {
    document.getElementById("hide_Arrow").className = "show";
  } else {
    document.getElementById("hide_Arrow").className = "";
  }
}
console.log(arrow);
#arrow {
  position: relative;
  height: 270px;
  display: block;
  margin: -20px auto;
  overflow: hidden;
}

#hide_Arrow {
  height: 0px;
  margin: -200px 00px 0px 0px;
  overflow: hidden;
}

#hide_Arrow.show {
  height: 250px;
}
<div id="hide_Arrow">
  <img id="arrow" src="media/Arrow_down.png" alt="Arrow Down">
</div>

1 ответ

Я думаю, что у вас есть опечатка.

Изменить это:

window.onscoll = function(){showArrow()};

За это:

window.onscroll = showArrow;

Надеюсь, поможет!

Привет, я также столкнулся с той же проблемой и решил ее при написании кода, как показано ниже в файле JavaScript...

window.addEventListener('scroll', function() {
   showArrow()
});

function showArrow() {
  if (document.body.scrollTop > 25 || document.documentElement.scrollTop > 25) {
    document.getElementById("hide_Arrow").className = "show";
  } else {
    document.getElementById("hide_Arrow").className = "";
  }
}
console.log(arrow);

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