Docs
useWindowScroll

Track and manipulate the scroll position of a web page with useWindowScroll.

Loading...

Installation

pnpm dlx shadcn@latest add https://usekit.kiron.dev/k/use-window-scroll

Usage

"use client"
 
import { useWindowScroll } from "@/hooks/use-window-scroll"
 
export function Component() {
  const [{ x, y }, scrollTo] = useWindowScroll()
 
  return (
    <div>
      <p>
        Current position: {x ?? "Loading..."}, {y ?? "Loading..."}
      </p>
      <button onClick={() => scrollTo(0, 0)}>Scroll to Top</button>
    </div>
  )
}

API Reference

Return Values

NameTypeDescription
stateobjectAn object representing the current window scroll position.
scrollToFunctionA function that can be used to scroll the window to a specific position.