能否将视频转换为纯 CSS？

这篇文章探讨了使用纯 CSS 播放视频的可能性。作者首先尝试使用 scroll-timeline 属性根据滚动位置创建动画效果，但发现 Safari 浏览器不支持该属性。之后，作者尝试使用 JavaScript 动态设置 CSS 变量来模拟 scroll-timeline 的效果，并成功实现了简单的动画。为了进一步提高动画效果，作者尝试加载 3D 模型并将 div 元素定位在模型的顶点上，但发现这种方法性能较差。最终，作者探索了两种使用纯 CSS 播放视频的方法：一种是使用大量 div 元素和 CSS 动画帧来模拟视频的每个像素，另一种是使用 box-shadow 属性来实现类似的效果。作者发现，box-shadow 方法的性能更好，并且创建了一个 Web 应用程序，可以将视频转换为纯 CSS 动画。