触摸波纹（Touch Ripple）

描述 (Description)

Touch Ripple是仅在Framework7材质主题中受支持的效果。 默认情况下，它在材质主题中启用，您可以使用materialRipple:false参数禁用它。

波纹元素

您可以启用ripple元素以匹配某些CSS选择器，例如 -

• ripple
• a.link
• a.item-link
• .button
• .tab-link
• .label-radio
• .label-checkbox等

这些在materialRippleElements参数中指定。 您需要启用touch波纹，将元素的选择器添加到materialRippleElements参数以使用波纹效果，或者只使用ripple类。

波纹波色

通过将ripple-[color]类添加到元素，可以在元素上更改纹波的ripple-[color] 。

例如 -

<a href = "#" class = "button ripple-orange">Ripple Button</a>

或者您可以使用CSS定义波纹波颜色，如下所示 -

.button .ripple-wave {
   background-color: #FFFF00;
}

禁用纹波元素

您可以通过向这些元素添加no-ripple类来禁用某些指定元素no-ripple 。 例如 -

<a href = "#" class = "button no-ripple">Ripple Button</a>