MotionLang

滚动相关 · 滚到哪、变到哪

滚动分档失焦Scroll quantized focus blur

一大段文字被钉在屏幕上,读到哪一段哪一段是清楚的,其它几段一起糊成虚影;往下滚,焦点一档一档往下移,像有人帮你把手电筒往下照。

在工具里打开这条

什么时候用它

长论述、FAQ、条款、分步说明这类「一次只该读一段」的内容用它;需要来回对照的表格和清单别用 —— 糊掉的部分正是用户要对照的。

参数

progress < .2 → idx 0 · < .9 → idx 1 · else idx 3 · others opacity .05 + blur 5px · 300ms ease-out · stepped, not interpolated

配方

  1. 滚动分档失焦 → 300ms ease-out
  2. 条件 progress < .2 → idx 0
  3. 条件 < .9 → idx 1

给 AI 的一句话

把这段文字做成滚动分档失焦:把滚动进度量化成几档(例如 .2 和 .9 两个阈值切三档),非当前档的段落一起降到不透明度 .05 并加 filter: blur(5px),当前档 opacity 1、blur 0,切换用 300ms ease-out。注意是分档切换,不是逐帧插值 —— 中间不该有过渡态。

同类的其他动效