useWindowScroll

v0.0.14testeddemo

Reactive window scroll position with arrived/direction tracking. Writing to x/y scrolls the window.

Example

const { x, y, isScrolling, arrivedState, directions } = useWindowScroll();

Loading demo…

export function useWindowScroll(options: UseWindowScrollOptions ={ ... }

Parameter	Type	Default	Description
`options`?	`UseWindowScrollOptions`	`{}`	Options

UseWindowScrollReturnReactive x, y, isScrolling, arrivedState, directions and a measure() helper

Property	Type	Default	Description
`x`	`WritableComputedRef<number>`	—	Reactive horizontal scroll position. Writing to it scrolls the window.
`y`	`WritableComputedRef<number>`	—	Reactive vertical scroll position. Writing to it scrolls the window.
`isScrolling`	`ShallowRef<boolean>`	—	Whether the window is currently being scrolled.
`arrivedState`	`Reactive<UseWindowScrollEdgeState>`	—	Whether each edge of the document has been reached.
`directions`	`Reactive<UseWindowScrollEdgeState>`	—	The direction(s) the window is currently scrolling towards.
`measure`	`() => void`	—	Force a re-measurement of `arrivedState`/`directions`.