用于多次滚动更改背景图像以创建动画的代码

Question

我在查看此站点时 ，发现背景图像在用户滚动时似乎是如何移动和动画的。 通过检查源代码，它表明这是通过在用户滚动时更改背景图像来实现的。 从本质上讲，它会跳过许多帧图像，给人以动画的错觉。

最快，最简单的方法是什么？ 我正在使用ScrollMagic库，如果这样做会更容易。

Answer 1

最快，最简单的方法是侦听元素上的滚动事件，然后通过CSS将背景url更改为要显示的文件。 您可能需要将纯滚动值转换为一个百分比（以考虑屏幕尺寸的变化），并且需要一个映射到这些百分比的图像数组。