Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of React Starter

Public visualization

Fork of React Starter

0 stars1🌍 Public
MMTR
Last edited Aug 25, 2023
Created on Aug 25, 2023
Forked from React Starter

This example demonstrates scroll-driven scaling: a sticky sky-blue box grows from 50% to 100% scale as the page scrolls through a 200vh wrapper. The App component tracks scroll progress via a `window.scrollY` event listener, computes a percentage from the scroll position relative to the wrapper’s total height, and applies the result as an inline `transform: scale()` style. It uses React’s `useState`, `useEffect`, `useRef`, and `useCallback` hooks, with rendering handled by `createRoot`.

AI-generated description

React Starter code.

Comments

Sign in to join the discussion.

MIT Licensed