用 GSAP ScrollTrigger 做捲動故事
本機落地頁，包含釘選 Hero、捲動觸發顯示、視差與 reduced-motion 後備。
第一個成果
捲動頁面時 Hero 會被釘選、故事節拍交叉淡入，後續區塊也會顯示。
適合對象
學習 GSAP 的網頁設計師
需要
Claude Code, 瀏覽器, 簡短故事想法
範例成果
捲動頁面時 Hero 會被釘選、故事節拍交叉淡入，後續區塊也會顯示。
本機落地頁，包含釘選 Hero、捲動觸發顯示、視差與 reduced-motion 後備。
釘選 Hero、四個節拍
ScrollTrigger 在約三個視窗高度內釘選 Hero，四個故事節拍以平滑的 scrub 交叉淡入。
釘選
3x vh 顯示
75% 視差
0.3x
3x vh 顯示
75% 視差
0.3x