React Ripple 개요

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

    React Ripple Example

    Usage

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

    npm install igniteui-react
    

    그런 다음 필요한 CSS인 IgrRipple을 가져와서 다음과 같이 모듈을 등록해야 합니다.

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

    다음을 추가할 수 있습니다. IgrRipple CSS가 있는 한 모든 웹 요소에 대한 구성 요소 position 속성이 다음 이외의 다른 값으로 설정되었습니다. static;

    Examples

    Color

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

    igc-ripple {
      --color: olive;
    }
    

    API References

    Additional Resources