Javascript Выполнение скрипта при прокрутке к определенному div-у?

Question

Javascript Выполнение скрипта при прокрутке к определенному div-у?

Quasar Гуру (2928), закрыт 4 года назад

везде примеры только на jquery

http://jsfiddle.net/te2wpams/

Дополнен 4 года назад

Answer 1

Ну как-то так: codepen.io/dimondevelop/pen/JjoYEYY (jsfiddle с iframe не очень подходит для таких задач, поэтому пришлось сделать на codepen). А еще лучше скопируй код в реальный проект, и там проверяй.

В коде считывается высоту блока и если он на в пределах экрана, то выводит в консоль "Hello!".

Нагляднее всего смотреть в fullscreen — codepen.io/dimondevelop/full/JjoYEYY

Если будут вопросы, спрашивай)

Answer 2

На чистом JS это будет очень большой код, если ты хочешь сделать сам, вычисли масштаб страницы, разрешение юзера, а потом относительно вычисленному, на проценте прокрутки где предположительно у пользователя находится див показываешь код.

Answer 3

В обработчике события 'scroll' проверяй позицию div'a относительно вьюпорта (получить отн. координаты можно методом элемента getBoundingClientRect) - то есть, виден ли этот див пользователю... если виден, то выполняй те действия которые хочешь.