Как отложить анимацию элемента до его появления на экране?

Question

[damarkuzz]

Как отложить анимацию элемента до его появления на экране?
Необходимо сделать так, чтобы анимация начиналась только тогда, когда видно элемент, но при указании стандартного, например animation: zoomIn 1s ease-in-out;, анимация выполняется сразу и элемент, например, внизу страницы, выполняется преждевременно.
Спасибо за ответы!

Comments

[Антон]

Отследить положение скролла от начала экрана до указанного блока, по достижении нужных координат добавлять класс анимации

[strelok011]

Если лень писать руками - подключите scrollmagic например

Answer 1

[Анатолий Куликов]

Wow.js

Comments

[origami1024]

Только они сами на гитхабе в ридми первой же строчкой пишут, что их библиотека устарела, и рекомендуют другую...

wow.js is temporarily deprecated in favour of AOS (Animate on Scroll)

[Анатолий Куликов]

origami1024, я что-то провафлил этот момент

Answer 2

[Никита]

Принцип ленивой загрузки пробовали?