jQuery Plugin To Create Customizable Ripple Click Effects

A simple lightweight jQuery plugin that captures the offsets of click event and applies a Google Material Design inspired 'Ripple' effect to clicked element using CSS3 magic.

Basic usage:

1. Load jQuery library and the jQuery Simple Ripple Effect's JS & CSS in your document.

<link href="simple-ripple-effect.css" rel="stylesheet">

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="simple-ripple-effect.js"></script>

2. Add a class 'ripple-effect' to any element and done.

<div class="ripple-effect"></div>

3. The plugin provides several data-* attributes to customize the ripple click effect.

• data-ripple-limit="": the limit for ripple effect
• data-ripple-color="": custom ripple color
• data-ripple-wrap-radius="": custom ripple radious
• data-ripple-wrap-class="": custom wrapper class

---

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