概述
本文主要讲述CSS 滚动驱动动画（CSS scroll-driven0animations），这一特性在Chrome 115中就得到了支持。
CSS 滚动驱动动画的意义
在这个特性之前，监听浏览器滚动事件需要借助 Javascript 进行控制，但是这种传统的方式会有卡顿的问题。因为浏览器的滚动和页面的渲染是不同的进程在执行，因此只能异步传递滚动事件。而 CSS 滚动动画就是为了解决这个卡顿的问题。
CSS 滚动驱动动画指的就是将动画的执行过程由页面滚动进行接管，在这种情况下，动画只会跟随页面的滚动的变化而变化，动画执行再不用设置时长，页面滚动多少，页面执行多少。
示例展示
滚动进度示例 1
css滚动进度
视图进度示例 2
