Vitaliy Bobrov
@SrikanthSrungarapu you can post any bugs on github https://github.com/vitaliy-bobrov/ion-ripple
Directive to add material design ripple effect.
A pure javascript (no polymer, no jQuery) Ionic directive that adds a Google Material Design ripple effect when clicked or touched based on angular-ripple.
bower install --save ion-ripple
npm install --save ion-ripple
Include the script in your HTML
<link href="lib/ion-ripple/ion-ripple.css" rel="stylesheet">
<script src="lib/ion-ripple/ion-ripple.min.js"></script>
Also you can import ripple scss
file into your app styles
@import '../lib/ion-ripple/ion-ripple';
There are some default SASS variables available that can be overriden:
$ion-ripple-color: #fff !default;
$ion-ripple-duration: .45s !default;
Then include ionMDRipple
in your module dependencies
angular.module('app', ['ionMDRipple']);
Then add the ion-ripple
attribute to elements
<button ion-ripple>Ripple!</button>
Also you can specify ripple effect color with ion-ripple-color
attribute.
<button ion-ripple ion-ripple-color="#ff0000">Ripple!</button>
Hey there! You'll need to log in before you can leave a comment here.
@SrikanthSrungarapu you can post any bugs on github https://github.com/vitaliy-bobrov/ion-ripple
HAVE YOU GOT A VIDEO OR EXAMPLE OF THE RIPPLE EFFECT? A GIF?
It is standard material design ripple effect, may be in the future I'll create some demo.
HAVE YOU GOT A VIDEO OR EXAMPLE OF THE RIPPLE EFFECT? A GIF?
It is standard material design ripple effect, may be in the future I'll create some demo.
@SrikanthSrungarapu you can post any bugs on github https://github.com/vitaliy-bobrov/ion-ripple
Hey there! You'll need to log in before you can leave a rating here.
Nice)
Thanks for creating this plugin. Couple of small concerns though. The ripple effect is not visible when I attach click action to butotn. So, I ended up adding 100 ms timeout delay for the click action to trigger so that user can get to see the ripple animation. And also, this is not working for lower versions of android (tested it on Android 4.3 and it didn't work) .
{{ rating.comment }}
{{ rating.comment }}
Thanks for creating this plugin. Couple of small concerns though. The ripple effect is not visible when I attach click action to butotn. So, I ended up adding 100 ms timeout delay for the click action to trigger so that user can get to see the ripple animation. And also, this is not working for lower versions of android (tested it on Android 4.3 and it didn't work) .
Nice)