Как посмотреть, какой из элементов виден на экране при скролле?
При прокрутке страницы вниз добавляются новые элементы, есть метод, который проверяет виден ли элемент boundary на экране.
Хочу сделать, чтобы при скролле вверх или вниз этот метод выводил в консоль, какой из элементов boundary виден на экране. А если видны сразу два и больше, показывал в консоле последний из них
Вот здесь есть функция которая возвращает массив элементов, которые видны. Правда она написана на jQuery, но думаю не составит труда ее переписать на чистый js если надо.
Lo Ran, если в общем: слушаем скролл -> знаем позицию скролла (относительно начала страницы) + позицию элемента относительно верха страницы -> cравниваем значения
Даниил сделал решение, но есть проблема с постоянным вызовом метода, при скролле. Очень сильно влияет на производительность. Было бы здорово, если подскажете как можно оптимизировать
Lo Ran, попробовать удалять слушатель при определённых условиях. Например слушать скролл без выполнения метода, а меняя переменную (допустим пока true - выполняем, как-только выполнили - false). Если допускается небольшая задержка - можно использовать что-то типа debounce
Либо используйте полифилл IO