angular-ripple-effect-lib
v1.0.3
Published
*Import the AngularRippleModule from node_modules package*
Downloads
24
Maintainers
Readme
Usage:
Step 1
Import the AngularRippleModule from node_modules package
import { AngularRippleModule } from 'angular-ripple-effect-lib';
@NgModule({
imports: [..., AngularRippleModule],
declarations: [...]
})
export class AppModule {}
Step 2
Import css in your main css file
@import "~angular-ripple-effect-lib/style.css";
Step 3
Attach [ripple] directive to some element
<div ripple></div>
You can specify the animation time, color, width and height of the animation
<div ripple timeout="1500" color="gray" width="20" height="20"></div>
Note! The element where you attach "ripple" Directive need to be visible somehow Note! Default ripple effect is white colored
<div ripple style="width:100px;height:50px;"></div>
or
<div ripple>
Lorem Ipsum is simply dummy text of the printing and typesetting industry
</div>
DEMO