Material Design styled ripple effect: Show the ripple effect on a given page element

Recommend this page to a friend!
  Info   View files Example   Demos   View files View files (4)   DownloadInstall with Composer Download .zip   Reputation   Support forum   Blog    
Ratings Unique User Downloads Download Rankings
Not enough user ratingsTotal: 148 All time: 336 This week: 5Up
Version License JavaScript version Categories
rippleeffect 1.0.0MIT/X Consortium ...3.0Animation, HTML
Description Author

This object can show the ripple effect on a given page element similar to Google Material Design implementation.

It can listen to a given event, like for instance onclick, inside a given parent element.

The object can show the ripple effect on the element that received the listened event.

Innovation Award
JavaScript Programming Innovation award winner
May 2015
Winner


Prize: One downloadable e-book of choice by O'Reilly
Material design is a design language created by Google provide better user experience by making user interfaces look more like when interacting with physical materials.

This JavaScript object provides a ripple effect implementation when clicking on page elements, similar to Google Material Design.

Manuel Lemos
Picture of Andras Toth
  Performance   Level  
Name: Andras Toth <contact>
Classes: 22 packages by
Country: Hungary Hungary
Age: 49
All time rank: 31 in Hungary Hungary
Week rank: 1 Up
Innovation award
Innovation award
Nominee: 15x

Winner: 9x

  ripple_effectExternal page  

Open in a separate window

  Files folder image Files  
File Role Description
Accessible without login Plain text file buttons.css Data stylesheet
Accessible without login Plain text file index.html Example example html
Accessible without login Plain text file ripple-effect.css Data stylesheet
Plain text file ripple-effect.js Class javascript

 Version Control Unique User Downloads Download Rankings  
 0%
Total:148
This week:0
All time:336
This week:5Up