Creating a water ripple animation following the mouse cursor on a HTML element

Sell Online With Shopify
Trusted by millions of businesses worldwide
For a limited time, sign up for a free trial and enjoy 3 months of Shopify for $1/month on select plans — offer ends Aug 25.

You want to make an good first impression on your Shopify store. Try creating a water ripple animation effect following the mouse cursor on an HTML element.

DEMO

ripples is a fancy jQuery plugin that helps you to do that.

ripples is a fancy jQuery plugin that creates a water ripple animation following the mouse cursor on a HTML element based on WebGL. Currently works with modern browsers that support at least one of the following: WebGL, OES_texture_float extension, OES_texture_float_linear extension.

How to use it:

Step 1:

Load jQuery ripples plugin at the end of the HTML document.

Step 2:

Create a HTML element with a background image that you want to apply the effect to.

Step 3:

Call the plugin with options

API methods

You may also like...

Leave a Reply

Your email address will not be published.