---
url: "https://vueda.dev/v3/reference/api/js/use/useScrollReveal/functions/useScrollReveal.md"
title: "useScrollReveal"
---

# useScrollReveal

## Overview

Derive a reactive `hidden` flag from scroll direction for hide-on-scroll page chrome.

Binds a scroll listener to the resolved target (rebinding if `scrollRoot` changes), measures the
element's original bottom edge as the threshold past which it counts as scrolled away, and
exposes `hidden` according to the chosen `reveal` strategy. The listener and any pending idle
timer are torn down automatically when the surrounding effect scope is disposed (component
unmount, or an explicit `effectScope().stop()`), so callers do not manage cleanup. The threshold
is only auto-measured when the target or element identity changes; call the returned `remeasure`
after layout shifts that move the element in place.

## Signature

`useScrollReveal(rootRef, options)`

### Parameters

| Name | Type | Required | Description |
| --- | --- | --- | --- |
| <span id="param-rootRef">rootRef</span> | `Ref` | yes | Ref to the element whose original on-screen position defines the hide threshold (typically the chrome's own root). |
| <span id="param-options">options</span> | [ScrollRevealOptions](/v3/reference/api/js/use/useScrollReveal/types/ScrollRevealOptions.md) | no | Reveal strategy, scroll container, and idle timing. |

### Returns

[ScrollRevealContext](/v3/reference/api/js/use/useScrollReveal/types/ScrollRevealContext.md)

The reactive `hidden` flag plus the raw scroll signals (so a multi-bar host can reuse one tracker across bars) and a `remeasure` function.

## Source

`client/lib/use/useScrollReveal.js:93`