Framework7 - сенсорная рябь

Описание

Touch Ripple - это эффект, который поддерживается только в теме материала Framework7. По умолчанию он включен в теме материала, и вы можете отключить его с помощью параметра materialRipple: false .

Элементы пульсации

Вы можете включить элементы пульсации, чтобы они соответствовали некоторым селекторам CSS, таким как -

• ripple
• a.link
• a.item-link
• .button
• .tab-link
• .label-radio
• .label-checkbox и т. д.

Они указываются в параметре materialRippleElements . Вам нужно включить пульсацию касания , добавить селектор элемента в параметр materialRippleElements, чтобы использовать эффект пульсации, или просто использовать класс пульсации .

Цвет волны пульсации

Цвет ряби на элементе можно изменить, добавив к элементу класс 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>