Angular scroll animation Components & Directives

Animate Elements In When They Enter The Viewport – ngx-animate-in

ngx-animate-in is a small Angular library to make it easy to animate elements in whenever they enter the viewport. Installation: # NPM $ npm install ngx-animate-in–save Usage: Import the module. import { BrowserModule } from ‘@angular/platform-browser’; import { NgModule } from ‘@angular/core’; import { AnimateInModule } from ‘../../src’; import { AppComponent } from ‘./app.component’; import { BrowserAnimationsModule } from ‘@angular/platform-browser/animations’; import { ProductListComponent } from ‘./product-list/product-list.component’; import { ProductComponent } from ‘./product-list/product/product.component’; @NgModule({ imports: , declarations: , providers: , bootstrap: }) export class AppModule { } Add the ‘animateIn’ to the

Angular Directive For Scroll Event Based Animations

An Angular.js directive which allows you to perform any javascript actions (in the controller, or on the element) when an element is scrolled into or out of, the users viewport, without requiring any other dependencies.