Web Components 리플 개요

    Ignite UI for Web Components Ripple 구성 요소는 터치나 마우스 클릭에 응답하여 애니메이션을 생성합니다.

    Web Components Ripple Example

    Usage

    먼저 다음 명령을 실행하여 Ignite UI for Web Components 설치해야 합니다.

    npm install igniteui-webcomponents

    ​IgcRippleComponent를 사용하기 전에 다음과 같이 등록해야 합니다.

    import { defineComponents, IgcRippleComponent } from "igniteui-webcomponents";
import 'igniteui-webcomponents/themes/light/bootstrap.css';

defineComponents(IgcRippleComponent);

    Ignite UI for Web Components 에 대한 전체 소개는 시작 항목을 참조하세요.

    사용을 IgcRippleComponent 시작하는 가장 간단한 방법은 다음과 같습니다.

    <igc-button>
  <igc-ripple></igc-ripple>
  Ripple Button
</igc-button>

    ​IgcRippleComponent 구성요소의 CSS position 속성이 static 이외의 값으로 설정되어 있는 한 모든 웹 요소에 추가할 수 있습니다.

    Examples

    Color

    ​--color CSS 속성을 유효한 CSS 색상으로 설정하여 잔물결 색상을 변경할 수 있습니다.

    igc-ripple {
  --color: olive;
}

    API References

    Additional Resources