滚动相关 · 滚到哪、变到哪
滚动逐帧序列Scroll frame sequence
- 一格一格跳
- 像拖影片
- 没有中间态
看着像视频,其实是一叠预渲染图(演示里 36 张真实商品照):往下滚它就往前跳一帧,往回滚滚就倒回去一帧,停住画面就定住。它是一格一格跳的 —— 没有「半帧」这种状态。
什么时候用它
产品 360° 转台、工艺过程、装机演示用它 —— 拍成视频太重、做成翻页又太轻的内容;文件要一次性预加载,帧数越多越重,别拿它做几十秒的片子。
参数
frames 36 · step = (section height − viewport) / (frames − 1) · index = round(progress × (frames − 1)) · swap image, never interpolate
配方
滚动逐帧序列 → frames 36 · step = (section height − viewport) / (frames − 1) · index = round(progress × (frames − 1)) · swap image, never interpolate
给 AI 的一句话
把这个区块做成逐帧序列:准备 N 张预渲染图,把滚动位置量化成整数帧号(index = round(进度 × (N − 1))),用这个帧号去换当前显示的那张图。不要插值、不要缓动 —— 它就该是一格一格跳的。段高按「每帧大约滚多少像素」来定。