Vize

scroll-lock

Lock scrolling of a single element by toggling overflow: hidden.

Package @vizejs/composable/scroll-lock
Own the source vize lib pull composable:scroll-lock
Runtime exports useScrollLock
Gzip budget 2048 B

Usage

import { useScrollLock } from "@vizejs/composable/scroll-lock";

Runtime contract

Utility Category Stability SSR Hydration Cleanup Targets Host globals Uses
useScrollLock dom experimental deterministic-fallback stable reactive-scope web, desktop — resolveElement, tryOnScopeDispose

API

useScrollLock

Lock scrolling of a single element by toggling overflow: hidden. The element's previous inline overflow is restored on unlock, target change, and scope disposal. This is intentionally element-scoped: for the document viewport (nested lock stacking, scrollbar-gap compensation, scroll restoration) use createScrollLock from @vizejs/ui/scroll-lock. Server renders never touch styles and report the requested initial value.

function useScrollLock( target: MaybeElementTarget, options: UseScrollLockOptions = {}, ): WritableComputedRef<boolean>

Types

UseScrollLockOptions

Options for useScrollLock.

Member Type Description
initialValue? boolean Lock as soon as the element resolves.
preventTouchMove? boolean Also cancel touchmove on the element while locked (iOS Safari ignores overflow: hidden for touch scrolling).