# WrScroll

> Smooth-scroll utility. Resolves elements / ids / selectors / coords; subtracts an `offset` for sticky headers; auto-falls back to instant scrolling when the user has `prefers-reduced-motion: reduce`.

Source: https://ngwr.dev/reference/services/scroll  
Kind: Service

## Usage

```angular-ts
private readonly scroll = inject(WrScroll);

this.scroll.to('#section-three', { offset: 80 });
this.scroll.toTop({ smooth: false });
this.scroll.intoView(myEl, { offset: 64 });
```

## Why ngwr provides this

`scrollIntoView` can't offset for a sticky header and `window.scrollTo` doesn't understand containers or selectors. This wraps both behind one API with offsets, smooth-scroll opt-out, and SSR safety.

## API

| Name | Description | Type | Default |
| --- | --- | --- | --- |
| `to(target, options?)` | Scroll to an element, id (`#foo`), selector, or `{ top, left }` coords. | `(t, opts?) => void` | `—` |
| `intoView(el, options?)` | Convenience for an Element — same options as `to`. | `(el, opts?) => void` | `—` |
| `toTop(options?)` | Scroll the page (or container) to the top. | `(opts?) => void` | `—` |
| `options.offset` | Pixel offset subtracted from the target (sticky-header compensation). | `number` | `0` |
| `options.smooth` | Smooth or instant. Auto-falls back to instant for `prefers-reduced-motion: reduce`. | `boolean` | `true` |
| `options.container` | Override the scroll container. | `Window \| Element` | `window` |