滚动相关 · 滚到哪、变到哪
从散落聚拢Assemble from scatter
- 先乱后齐
- 同时收
- 有归属感
一排卡片刚开始是歪七扭八散着的:每张被推到不同方向、各自歪着不同角度。往下滚,它们一边往回收一边转正,滚到一半时「啪」地全对齐成整齐的网格。它们是一起动的,只是一开始各自站得不一样。
什么时候用它
产品特性区、团队墙、任何「先被拆散再拼起来」的概念用它;如果这些卡片本来就有顺序或层级关系,别用 —— 散开会让顺序读不出来。
参数
per-card offset ±(6–24)vw / ±11vh and rotate −41…+46deg · progress 0 → .46 collapses all to 0 · scroll-driven lerp, no easing · all start together
配方
条件 scroll-driven lerp, no easing由滚动位置驱动 lerp, no easing从散落聚拢 → per-card offset ±(6–24)vw / ±11vh and rotate −41…+46deg · progress 0 → .46 collapses all to 0 · all start together
给 AI 的一句话
让这排卡片从散落聚拢:给每张卡片一个专属的初始偏移(约 ±6–24vw、±11vh)和专属旋转角(−41 到 +46 度之间),再按滚动进度把它们同时补间到 0,滚到 46% 时全部对齐。注意是同时开始、起点不同 —— 不是依次入场,那样就变成错峰了。