Parallax Controller: Introduction
Core classes and controller for scroll-driven parallax effects powered by the Web Animations API. Each element is driven by a ScrollTimeline or ViewTimeline—translate, rotate, scale, and opacity keyframes advance with scroll progress on the compositor, without per-frame style writes. Use explicit scroll offsets when you need a fixed window, or let view timelines tie motion to when elements enter, cross, and leave the scrollport, with layout-aware animation-range tuning so effects finish at the right moment.
NPM Package
npm install parallax-controller@beta
React Integration
If you're building with React use react-scroll-parallax, a set of hooks and components to easily create effects and interact with the parallax-controller.
npm install react-scroll-parallax
See the React Scroll Parallax documentation for usage and demos.
Demos
This package was created for react-scroll-parallax, but can be used as a standalone lib. Most demos were built with react-scroll-parallax.