Demo of parallax scrolling developed by gen AI in 1 go (one shot).
One single file. No frameworks, no build step, no dependencies, no images — every fish, jellyfish and whale is inline SVG generated by code.
Three fixed layers moved with translate3d at different speeds, driven by scrollY inside requestAnimationFrame with a ticking flag — GPU-composited, zero jank.
The background is a live gradient interpolated in JS — five color stops lerped per scroll position, so the ocean darkens continuously from aqua to abyss.
IntersectionObserver fade-ins, CSS keyframe bubbles and swimmers, drop-shadow glow on jellyfish, clamp()-based fluid type — all vanilla, all in under 300 lines.