A “how it works” section freezes on screen while you scroll; the three steps and their photos swap in place, then the page moves on.
✕ Breaks rule: scroll-jacking (pinned section) The screen stops moving while you keep swiping, so on a phone it feels stuck; people flick past steps 2 and 3, and the next section (often the call button) is several swipes further away.
Best for: App and product launches with a real 3-4 step story. Batch 1's scroll-drawn steps tell a trade's story without holding the page. How: ScrollTrigger pin with scrub over 250% of the screen height; one timeline cross-fades steps and photos and fills a progress bar. No JS: a normal list. Weight: 1.3 KB gzipped (our CSS + JS) + GSAP from jsDelivr: GSAP core 28.3 + ScrollTrigger 18 KB gzipped. Plugins: ScrollTrigger. Page-level effect: it takes over the whole page, so it runs inside the phone frame below (open it full screen to try it at full size).