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

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