Descripción general de Ripple Web Components
El componente Ripple Ignite UI for Web Components crea una animación en respuesta a un toque o un clic del mouse.
Web Components Ripple Example
Usage
Primero, debe instalar la Ignite UI for Web Components ejecutando el siguiente comando:
npm install igniteui-webcomponents
Antes de utilizar IgcRippleComponent
, debe registrarlo de la siguiente manera:
import { defineComponents, IgcRippleComponent } from "igniteui-webcomponents";
import 'igniteui-webcomponents/themes/light/bootstrap.css';
defineComponents(IgcRippleComponent);
Para obtener una introducción completa a Ignite UI for Web Components, lea el tema Introducción.
La forma más sencilla de empezar a utilizarlo IgcRippleComponent
es la siguiente:
<igc-button>
<igc-ripple></igc-ripple>
Ripple Button
</igc-button>
Puede agregar el componente IgcRippleComponent
a cualquier elemento web siempre que su propiedad position
CSS esté establecida en cualquier otro valor que no sea static
;
Examples
Color
Puede cambiar el color de la onda estableciendo la propiedad CSS--color
en cualquier color CSS válido:
igc-ripple {
--color: olive;
}