Jam*_*e G 7 html javascript css image
我正在建立一个视差滚动网站(不是我们所有人),除其他外,在用户滚动时显示图像.
我通过将图像放在背景中并在顶部放置一个实心填充的div来完成'显示'.然后,我根据滚动位置将此div从100%高度设置为0%高度,从而显示背景图像.
我多次做这种事情,不幸的是我变慢了.
使用Chrome的内置时间轴功能,我可以看到大部分速度都来自图像解码.对于上面的揭示,它每帧重新解码图像,每帧每帧需要22ms.
有谁知道浏览器何时需要进行图像解码,何时不需要?对我来说,如果我调整图像大小,但是当我只有一半覆盖图像时,它是否需要呢?
谢谢你的帮助.
如何使该属性具有动画效果?我认为除了对高度进行动画处理(这是容器的某种调整大小)之外,您可能还有很多选择。
也许用另一个元素“剪辑”背景图像的强度较低。我在 StackOverflow 上找到了一个关于它的帖子并提供了一些建议。如果你用 JavaScript 制作动画,不幸的是伪元素是没有选择的......