Описание тега ripplejs
NoneJakiestfu/Ripple.js - Adds Material style ripple to anything
Demo: http://jakiestfu.github.io/Ripple.js/demo/
GitHub: https://github.com/jakiestfu/Ripple.js
Usage: Include jQuery, the ripple.css, and ripple.js into your page. Then upon initialization, you can activate ripple using $.ripple(selector,options)
:
Stack Snippet Starter Pack
HTML
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/Ripple.js/1.2.1/ripple.css"> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Ripple.js/1.2.1/ripple.js"></script> <button class="btn btn-primary btn-lg" >Click Me</button>
JavaScript
$.ripple(".btn", { on: 'mousedown', // The event to trigger a ripple effect opacity: 0.4, // The opacity of the ripple color: "auto", // Set the background color. "auto" will use the text color duration: 0.7, // The duration of the ripple easing: 'linear' // The CSS3 easing function of the ripple });