Как определить прокрутку за пределами начала страницы, используя Javascript? - PullRequest
2 голосов
/ 20 февраля 2020

У меня есть панель навигации вверху страницы HTML, которая, когда клиент пытается прокрутить верх, должна развернуться (используя CSS и Javascript; я не хочу, чтобы она была прокручиваемой, так как Я хочу дать ему анимацию). Javascript Я использовал, чтобы попытаться обнаружить это:

window.addEventListener('scroll', function(e) {
    // do whatever to confirm the page is scrolling
});

, и хотя это работает для регулярной прокрутки, он не определяет, когда клиент пытается прокрутить границы страницы. Я также пытался использовать if (window.scrollY <= 0), но он отключается всякий раз, когда клиент находится вверху страницы (и не определяет, остается ли клиент сверху или пытается прокрутить его).

Есть ли способ, с помощью которого я могу обнаружить прокрутку за верхнюю часть страницы, используя Javascript, желательно без лишних проблем с форматированием?

Ответы [ 2 ]

3 голосов
/ 20 февраля 2020

Вы можете использовать событие «wheel» вместо события «scroll».

https://developer.mozilla.org/en-US/docs/Web/API/Element/wheel_event

addEventListener('scroll', ...)
1 голос
/ 20 февраля 2020

это у вас работает?

window.addEventListener('scroll', function(e) {
    console.log(window.scrollY);
    if (window.scrollY <= 0) {
      alert('TOP');
    }
});
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>
test<br>
test<br>test<br>
test<br>test<br>
test<br>
test<br>
test<br>
test<br>
test<br>
test<br>
test<br>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...