Posts

Showing posts from June, 2019

Angular 4 Animation

npm install @angular/animations@latest --save import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; @NgModule({   // Other arrays removed   imports: [     BrowserModule,     FormsModule,     HttpModule,     BrowserAnimationsModule   ], }) import { trigger,state,style,transition,animate,keyframes } from '@angular/animations'; @Component({   selector: 'app-root',   templateUrl: './app.component.html',   styleUrls: ['./app.component.scss'],   animations:[     trigger('listAnimationy', [       transition('void => *', [           query('li', style({opacity:0, transform: 'translateY(-50px)'})),           query('li', stagger('150ms', [             animate('500ms 1.2s ease-out', style({ opacity: 1, transform: 'translateY(0px)' }))           ]))       ])     ]),     trigger('listAnimationx', [       transition('void =

How to create interactive static Footer

How to  create  interactive static Footer  html {     height: 100%; } body{     position: relative;     height: 100%;     min-height: 100%; } .main-wrapper{     min-height: 100%;     position: relative; } .footer {     position: absolute;     bottom: 0;     left: 0;     right: 0;     text-align: center; }                                                                             </