Java视差在Mac上落后

Question

我制作了一个视差页面，其中使用JS更改了背景图片

translateY(- ... px)' 

与firewatch website上看到的相同。

在Windows上，它可以正常运行。但是，在macOS上，它只能在Safari中正常运行。所有其他浏览器都很笨拙，我无法找到答案。我尝试了CSS过渡，但这没有帮助。 为什么Firewatch视差滞后？ 我正在按照this指南

进行编码

Answer 1

尝试在您的CSS中添加will-change: transform; transform: translate3d(0, -...px, 0)，并在您的js中实现requestAnimationFrame。 More info here。

这不是iOS的建议，但可以提高动画的性能和平滑度，也许这种改善足以使动画平滑。有时候iOS对动画转换的反应不太好。

Answer 2

您必须通过浏览器启用GPU的使用，将translateY(...)替换为transform: translate3d(0, ..., 0)。这将迫使浏览器使用GPU进行渲染，并且应该会更加流畅。