Это часть курса JavaScript 30, над которым я сейчас работаю.
Это подчеркивает, как обрабатывать события при прокрутке. В этом примере изображения вылетают с полей при прокрутке.
- Вы должны использовать функцию debouncer для обратного вызова прослушивателя событий.
scroll
события могут генерировать много событий в секунду, что может замедлить работу вашей страницы. Если вы используете функцию дебаунсера, это ограничит количество срабатываний функции события, повысив производительность страницы.
Чтобы достичь этого эффекта, вам нужно знать различные вертикальные местоположения. Вот несколько советов по их поиску:
- Чтобы узнать, прокрутил ли пользователь страницу на одну длину, то есть в нижнюю часть изначально загруженного представления:
window.scrollY + window.innerHeight
HTMLelement.offsetTop
= расстояние текущего элемента относительно верхней части элементаoffsetParent
- Нижняя часть элемента =
HTMLelement.offsetTop + HTMLelement.height