Scrollbar
November 2, 2026Less than 1 minute
Scrollbar
Start with the basic example, then compare related settings before moving to controlled, asynchronous or combined use cases.
Basic examples
Basic usage
Appearance and states
Type
type: Type
Lifecycle and edge cases
Thumb Lifecycle
Lifecycle
API
<scrollbar> Props
| Parameter | Description | Type | Default |
|---|---|---|---|
| type | Type | 'track' | 'embed' | 'embed' |
| outer-class | Outer class | string|object|array | - |
| outer-style | Outer style | StyleValue | - |
<scrollbar> Events
| Event | Description | Arguments |
|---|---|---|
| scroll | Emitted on scrolling | - |
<scrollbar> Methods
| Method | Description | Arguments | Returns | Version |
|---|---|---|---|---|
| scrollTo | Scroll | options: number | {left?: number;top?: number}y: number | - | |
| scrollTop | Vertical scroll | top: number | - | 2.40.0 |
| scrollLeft | Horizontal scroll | left: number | - | 2.40.0 |
Type definitions
The component exports the following types
import type { ScrollbarBoxInstance } from '@cedar-design/ui'