GoldTreeDevGTD UI

문서 제목, 아이콘 이름, 앱 이름으로 검색할 수 있어요.

전체 문서 보기 이동 · Enter 열기 · Esc 닫기

ScrollFade

New

스크롤 위치에 따라 콘텐츠를 나타내거나 사라지게 해요.

사용법

콘텐츠가 화면을 통과하는 위치에 맞춰 자연스럽게 나타났다 사라져요.

스크롤에 맞춰 흐려져요

인터페이스

ScrollFadeProps

속성타입기본값설명
mode"in" | "out" | "both"both페이드 동작
fadeInEndnumber0.3페이드 인 종료 비율
fadeOutStartnumber0.7페이드 아웃 시작 비율
minimumOpacitynumber0최소 불투명도
classNamestring루트 클래스
styleCSSProperties인라인 스타일·CSS 변수

ScrollFade 컴포넌트 Props 표

가져오기

모션 CSS는 @goldtreedev/ui/motion.css를 함께 import해요.

@import "@goldtreedev/ui/motion.css";

import { ScrollFade } from "@goldtreedev/ui";
ScrollFade · 모션 UI | GoldTreeDev Docs