v-ons-ripple

Adds a Material Design “ripple” effect to an component. The ripple effect will spread from the position where the user taps. Some components such as <v-ons-button> and <v-ons-fab> support a ripple attribute.

Tutorial

See also

Props

Name Type Default Value Description
background String Color of the background. Optional.
center Boolean If this attribute presents, change the position of wave effect to center of the target component. Optional.
color String Color of the ripple effect. Optional.
disabled Boolean If this attribute is set, the ripple effect will be disabled. Optional.
modifier String The appearance of the ripple effect. Optional.
size String Sizing of the wave on ripple effect. Set “cover” or “contain”. Default is “cover”. Optional.

Preset Modifiers

Name Description
light-gray Change the color of effects to light gray.

Discussion

Need Help?

If you have any questions, use our Community Forum or talk to us via Gitter chat. The Onsen UI team and your peers in the community will work together to help solve your issues.

For bug reports and feature requests use our GitHub Issues page.