How to delay the animation of an element until it appears on the screen?

Question

css

How to delay the animation of an element until it appears on the screen?
It is necessary to make the animation start only when the element is visible, but when specifying a standard one, for example , the animation is performed immediately and the element, for example, at the bottom of the page, is executed prematurely. Thanks for answers! animation: zoomIn 1s ease-in-out;

Answer 1

wow.js

Answer 2

Have you tried lazy loading?