Framework7 触摸波纹
说明
Touch Ripple 是一种仅在 Framework7 材质主题中支持的效果。默认情况下,它在材质主题中启用,您可以使用
materialRipple:false 参数禁用它。
波纹元素
您可以启用涟漪元素以匹配某些 CSS 选择器,例如-
ripple
a.link
a.item-link
.button
.tab-link
.label-radio
.label-checkbox 等
这些在
materialRippleElements 参数中指定。您需要启用
touch 波纹,将元素的选择器添加到
materialRippleElements 参数以使用波纹效果,或者只使用
ripple 类。
波纹波浪颜色
可以通过向元素添加
ripple-[color] 类来更改元素上波纹的颜色。
例如-
<a href = "#" class = "button ripple-orange">Ripple Button</a>
或者您可以使用 CSS 定义波纹颜色,如下所示-
.button .ripple-wave {
background-color: #FFFF00;
}
禁用波纹元素
您可以通过向这些元素添加
no-ripple 类来禁用某些指定元素的波纹。例如-
<a href = "#" class = "button no-ripple">Ripple Button</a>