Some elements, like the button, have native ripple effect on Ionic 2. Others like cards doesn't. How could I add support to ripple effect on an arbitrary Ionic 2 element?
The ripple effect component adds the Material Design ink ripple interaction effect. This component can only be used inside of an <ion-app> and can be added to any component.
A ripple effect occurs when an initial disturbance to a system propagates outward to disturb an increasingly larger portion of the system, like ripples expanding across the water when an object is dropped into it.
--ripple-color CSS variable could be used to turn off the ripple effect. For example, we could set --ripple-color: transparent on the button, to effectively disable the effect.
Try wrapping the content like this:
<button ion-item>
<ion-item style="background: rgba(0,0,0,0);">Content</ion-item>
</button>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With