这是一款滚动驱动的手机拆解演示效果，基于 HTML+CSS+原生 JavaScript 与 Canvas 逐帧绘制实现，不依赖任何动画库。做法是先把一段三维拆解动画导出成 220 张 WebP 序列帧，页面预加载完成后（带进度条和锁滚动的加载页），用 500vh 的高容器配 position: sticky 把画面钉在视口中央，再把滚动进度映射成帧序号，画面就像被手指"拖着"逐帧播放——手机零件随着下滚层层分离，回滚则原样合拢。
这类效果之所以在数码产品官网里常见，正是因为它把复杂三维演示变成了纯图片播放，兼容性和稳定性都比实时渲染省心。真正的门道有两处：一是加了插值缓动（每帧向目标帧靠近 8%），所以滚动再快画面也是顺滑追赶而不是硬跳；二是必须等全部帧加载完再放行滚动，否则会出现掉帧和卡顿——这也是它的代价，220 张图的首屏体积不小，实际落地时建议压缩尺寸、按屏幕分辨率提供两套序列，移动端酌情减到八九十帧。演示用的帧图挂在作者的远程域名上，自己用时要换成本地或自己 CDN 的路径。
适用于数码产品与硬件官网、新品发布落地页、汽车与家电结构展示、工业设计方案演示等场景。
