События scroll и wheel в браузере

1 мин
Автор PINTA IT
События scroll и wheel в браузере

Scroll  это событие на HTML-элементе. Событие происходит, когда страница или элемент не входит на экран и пользователь её прокручивает. Способ прокрутки может быть любым - колесом мыши, кнопками клавиатуры, с помощью полосы прокрутки на экране.

Событие wheel происходит, когда пользователь прокручивает колесо мыши. При этом реального прокручивания может не происходить. Например, наша страница полностью помещается на экран, но пользователь пытается её прокрутить. В этом случае событие wheel будет происходить, а событие scroll - нет.

// обрабатываем скролл на всей странице
 document.addEventListener('scroll', function(event) {
   // реагируем на событие
   console.log(event);
 });

 // отловим все случаи, когда пользователь крутит колесо мыши
 // при наведенном на элемент курсоре
 let div = document.getElementsByTagName('div')[0];
 div.addEventListener('wheel', function(event) {
   console.log(event);
 });

Похожие публикации