useScrollProgress

See source on Github 

Registers a “scroll observer” on ref and executes callback when the observed element is scrolled inside the viewport.

• @param ref - Ref of the element to observe.
• @param callback - Callback invoked with progress data.
• @param options - Configuration (friction, precision, observer options, etc.).
• @returns void

Example

const ref = useRef<HTMLDivElement>(null);
 
useScrollProgress(ref, (entry) => {
  console.log('The element\'s inner progress is:', entry.innerProgress)
  console.log('The element\'s outer progress is:', entry.outerProgress)
})

UseScrollProgressEntry

See source on Github 

Data provided to the scroll progress callback.

UseScrollProgressCallback

See source on Github 

Callback type invoked with scroll progress data.

UseScrollProgressOptions

See source on Github 

Options for useScrollProgress.

Extends IntersectionObserverInit with extra settings for smoothing and control.