你的专属推荐
动画还原说明
内容依次入场,封面背景始终匀速运动。
16 个动画单元
遮罩 ×1 · 弹窗 ×1 · 标题 ×1
单集卡片 ×3 · 操作区 ×1 · 封面列 ×9
01 入场
0–920 ms以展开弹窗为 0 ms。各元素交叠入场,位移和淡入同时发生。
02505007501000 ms
遮罩
450 ms
弹窗
450 ms
标题
460 ms
单集 1
430 ms
单集 2
430 ms
单集 3
430 ms
操作区
460 ms
遮罩淡入至 60% 黑色;弹窗从底部滑入。均为 450 ms,先快后慢。
标题、3 张卡片、操作区依次淡入并轻微上移;卡片与操作区伴随轻微放大,结束时归位。
运动参数
- 遮罩 / 弹窗
- 曲线 (0.46, 0.21, 0, 1)
- 内容入场
- 曲线 (0.2, 0, 0, 1),透明度 0 → 100%
- 标题 / 操作区
- 上移 12 px,缩放 99% → 100%
- 3 张单集卡片
- 上移 14 px,缩放 98.5% → 100%
02 封面背景
持续循环9 列各自上下往返,相邻列反向。全程匀速,到端点立即反向,不停顿、不加减速。
向上向下每行展示一次完整往返
0102030 s
第 1 列
↑ 10.97s↓ 10.97s↻
第 2 列
↓ 12.74s↑ 12.74s↻
第 3 列
↑ 13.93s↓ 13.93s↻
第 4 列
↓ 11.85s↑ 11.85s↻
第 5 列
↑ 13.33s↓ 13.33s↻
第 6 列
↓ 12.45s↑ 12.45s↻
第 7 列
↑ 14.22s↓ 14.22s↻
第 8 列
↓ 12.15s↑ 12.15s↻
第 9 列
↑ 13.03s↓ 13.03s↻
条内为单程时长;一去一回后重复。列号按整组旋转前从左到右排列。
背景从页面加载起就开始运动;弹窗打开、收起、重播时,都保持原有进度。
封面整组固定倾斜 −8.94°。奇数列单程上移 60 px,偶数列单程下移 75 px(起点偏移 −45 px);沿各列自身纵轴运动。
03 退场
0–350 ms以收起弹窗为 0 ms。弹窗和内部内容整体下滑离场,遮罩同时淡出。
0175350 ms
弹窗整体
遮罩
曲线 (0.32, 0.38, 0.2, 1)。内部元素随弹窗离场,不单独错峰退场。