jQuery Plugin For CSS3 Based Ripple Click Effect yarp js - Download jQuery Plugin For CSS3 Based Ripple Click Effect - yarp.js

Download jQuery Plugin For CSS3 Based Ripple Click Effect – yarp.js

Posted on

This time I will share jQuery Plugin and tutorial about jQuery Plugin For CSS3 Based Ripple Click Effect – yarp.js, hope it will help you in programming stack.

jQuery Plugin For CSS3 Based Ripple Click Effect yarp js - Download jQuery Plugin For CSS3 Based Ripple Click Effect - yarp.js
File Size: 5 KB
Views Total: 3802
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Yet another jQuery plugin that implements the Material Design inspired ripple animation on any clickable elements using CSS3 transforms and transitions.

How to use it:

1. Load the minified version of the jQuery yarp.js after jQuery library (slim build).

1 <script src="//code.jquery.com/jquery-3.1.1.slim.min.js"></script>
2 <script src="yarp.min.js"></script>

2. Initialize the plugin on the target element and done.

1 $('.element').yarp();

3. Create your own color array for the ripple effect.

1 $('.element').yarp({
2  
3   // Colors to be used randomly
4   colors: ['gray']
5    
6 });

4. Set the duration of the ripple effect.

1 $('.element').yarp({
2  
3   // in milliseconds
4   duration: 750
5  
6 });

This awesome jQuery plugin is developed by Ardethian. For more Advanced Usages, please check the demo page or visit the official website.

source : jqueryscript.net