creativetimofficial / material-kit

Free and Open Source UI Kit for Bootstrap 5, React, Vue.js, React Native and Sketch based on Google's Material Design
https://www.creative-tim.com/product/material-kit?ref=mk-creativetimofficial-github
MIT License
5.91k stars 1.37k forks source link

Cannot implement ripple effect other than buttons #141

Closed sohan5005 closed 5 years ago

sohan5005 commented 6 years ago

Didn't find anything about this on documentation.

Is there any way to implement the ripple click effect on any element I want? Like in materialize I can just add a class to any element and it have the ripple effect. There are also classes to make the ripple dark.

What is the javascript method to initiate the ripple effect?

luchosrock commented 6 years ago

AFAIK the ripple effect is part of the bootstrap-material-design library. Try adding the ripple class to any element, like this:

<div class="ripple">HELLO</div>

That will do the trick!

See this file from the bootstrapMaterialDesign repo to see how it works.

I hope it helps 😄