React Ripple 개요

    Ignite UI for React Ripple 구성 요소는 터치 또는 마우스 클릭에 대한 응답으로 애니메이션을 만듭니다.

    React Ripple Example

    Usage

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

    npm install igniteui-react
    

    그 다음에는 다음과 같이 필요한 CSS를IgrRipple 가져오면 됩니다:

    import { IgrRipple } from 'igniteui-react';
    import 'igniteui-webcomponents/themes/light/bootstrap.css';
    
    <IgrButton>
      <IgrRipple></IgrRipple>
      <span>Ripple Button</span>
    </IgrButton>
    

    다음에 추가할 수 있습니다.IgrRipple CSS인 웹 요소의 컴포넌트입니다position 속성은 이외의 값으로 설정됩니다.static;

    Examples

    Color

    CSS 속성을 유효한 CSS 색상으로 설정--color 하면 리플의 색상을 변경할 수 있습니다:

    igc-ripple {
      --color: olive;
    }
    

    API References

    Additional Resources