Product media placeholder
Replace this area with a screenshot or short walkthrough video during the media sweep.
Tracks pointer position over an element. One node emits all coordinate spaces in parallel — wire whichever output the consumer needs.
Type pointerCategory inputsContext domDynamic ports noCompound no
Inputs
| Port | Type | Description |
|---|---|---|
| - | - | No ports declared. |
Outputs
| Port | Type | Description |
|---|---|---|
x | float | Pixel coordinate relative to the element rect (left edge = 0). |
y | float | Pixel coordinate relative to the element rect (top edge = 0). |
normalizedX | float | Element-relative [0..1]. 0 = left edge, 1 = right edge. Drop into nodes expecting 0..1 progress. |
normalizedY | float | Element-relative [0..1]. 0 = top edge, 1 = bottom edge. |
centeredX | float | Element-relative [-1..1] with 0 at the element center. Use for parallax / tilt where neutral = no transform. |
centeredY | float | Element-relative [-1..1] with 0 at the element center. |
isInside | float | 1 when the pointer is over the element, 0 otherwise. Use for hover gates. |
Parameters
| Parameter | Type | Default | Description |
|---|---|---|---|
selector | elementSelector | "" | CSS selector for the element pointer coords are measured against. In `element` space, outputs are relative to this element's rect (rect moves with scroll). In `viewport` space, the element only gates `isInside`; coords are clientX/clientY. Example: "body" for full-page, ".hero" for a section-scoped tracker, "#card-1" for a specific element. |
smoothing | float | - | Built-in exponential lowpass on the raw pointer position. 0 = snaps to cursor; 0.6 = silky parallax; 0.9 = very smooth / heavy lag. Frame-rate independent. **For spring / linearApproach / advanced curve shapes** leave this at 0 and chain a `smoothing` node downstream — same effect, full curve catalogue available. min 0; max 0.99; step 0.05 |
space | enum | - | `element` (default) — x/y are rect-relative; the bound element's rect.top moves with scroll, so `y` includes scroll delta when the element scrolls past. Use for in-section hover effects. `viewport` — x/y are clientX/clientY, normalized against window dims; stable regardless of scroll. Use for `position: fixed` cursor elements that need to sit under the actual mouse on every section. Default `element`. options element, viewport |
Use cases
- Cursor-driven element transforms — wire `x`/`y` straight into pose properties for cursor-following effects.
- Centered parallax / tilt — wire `centeredX`/`centeredY` (range [-1..1], origin at element center) into rotate or skew animations.
- Velocity / progress drivers — wire `normalizedX`/`normalizedY` into nodes that expect 0..1 input (mouseVelocity, multiKeyframe progress, etc).
Envelope
Use pointer as the node type inside a graph node envelope. Add id, optional params, optional connections, and optional activeWhen based on the guide context.
Generated source
Registry faster-motion-docs/node-registry.jsonCategory page /help/faster-motion/faster-motion-node-category-inputs/