Angular Viewport Animations

Animate elements, again and again, on scroll, everytime they become visible in the viewport. ( Live example on https://www.ativo.ro/ )

1. npm i angular-viewport-animations
2. Import it in AppModule: import { ScrollAnimations } from 'angular-viewport-animations'; and add ScrollAnimations to the imports Array;
3. Usage: <h1 scrollAnimation="fadeInBottom">Animate this element</h1>

Available options: fadeInBottom, fadeInTop, fadeInLeft, fadeInRight

Aditionally you can specify duration and delay ex: duration="2s", delay="2s"

Example usage with options:

<h1 
    scrollAnimation="fadeInLeft"
    duration="2s"
    delay="2s"
>Animate this element</h1>

DEMO: https://angular-libs-showcase.web.app/viewport-animations