Reel / 01
Scroll is the scrubber
This footage is not playing. Your scroll position is its playhead, and every pixel you travel advances a single frame.
Scroll Video Scrub
Your scroll position is the playhead. Keep scrolling: a real video seeks frame-by-frame while a track of chapters pans sideways across it.
Scroll01
Pinned Video Scrub
Scroll down slowly and the ink blooms one frame at a time; flick the wheel and the film races while the type smears with your speed, then settles crisp. The rail at the bottom is a live playhead. Scroll back up and it rewinds, exactly.
Reel / 02
A real video, seeking live
No sprite sheet, no image sequence. One <video>, its currentTime driven straight from ScrollTrigger progress and re-encoded all-intra so every seek lands instantly.
Reel / 03
The story moves sideways
While the film scrubs, this chapter track pans horizontally across it. Two motions, one gesture, locked to the same scrubbed timeline.
Reel / 04
Flick it and it smears
Throw the wheel and the type skews and blurs with your scroll velocity, then relaxes back to crisp the moment you stop. Fast in, controlled out.
Reel / 05
Cut.
Let go. The playhead holds exactly where you left it. That is the whole trick, and it is just a video and a tween.
02
How the scrub maps
One ScrollTrigger owns the pin and a scrubbed timeline. The timeline runs the horizontal pan and a slow push-in on the film; its onUpdate maps scroll progress onto the video's currentTime, throttled by the seeked event so seeks never pile up. On touch, the film loops muted as a backdrop and the chapters stack; reduced motion holds the poster with the chapters read as a static list.