사용법
문서 전체의 스크롤 진행률을 상단 막대로 표시해요.
페이지를 스크롤해 진행률을 확인해 보세요
인터페이스
ScrollProgressProps
| 속성 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| orientation | "horizontal" | "vertical" | horizontal | 진행 막대 방향 |
| position | "top" | "right" | "bottom" | "left" | — | 화면 고정 위치 |
| thickness | number | 4 | 진행 막대 두께(px) |
| label | string | 페이지 스크롤 진행률 | 접근성 라벨 |
| className | string | — | 루트 클래스 |
| style | CSSProperties | — | 인라인 스타일·CSS 변수 |
ScrollProgress 컴포넌트 Props 표
가져오기
모션 CSS는 @goldtreedev/ui/motion.css를 함께 import해요.
@import "@goldtreedev/ui/motion.css";
import { ScrollProgress } from "@goldtreedev/ui";