Very simple Javascript based android ripple effect for web.
- Download ripple.js
- Link css:
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="./ripplejs.css"> </head>
- Link JS:
<script src="./ripple.js"></script>
- html:
<div class="ripple"></div>
- JavaScirpt:
var element = document.querySelector(".ripple") addRipple(element)
element
: (Requied) parent element for ripple domain
rippleGrowMax
: (Optional Default: 100%) Maximum allowed size for ripple effect in % or any other css units
rippleOpacity
: (Optional Default: 0.3) Maximum allowed opacity for ripple effect in range of 0 to 1