固定位置背景 - Chrome问题

Question

我最近整理了一个网站，该网站使用固定图像作为背景，文字在其上滚动。当我使用chrome（不是任何其他浏览器）时，滚动停止在背景之间工作，停止大约一秒钟，然后继续。我不知道如何解决这个问题，所以任何建议都值得赞赏。

以下是该网站的链接：http://umdtamid.com/

Answer 1

我相信它是因为在视图中没有加载和渲染下一个背景。您的图片质量非常高，因此我们可以注意到延迟。

（请注意，第一次向下滚动时，每两个背景之间只会发生一次。）

尝试缩小图像大小，或使用CSS或javascript预加载图像。

使用js预加载

<script>
  bg1 = new Image();
  bg2 = new Image();
  bg3 = new Image();
  bg1.src="url here";
  bg2.src="url here";
  bg3.src="url here";
</script>

仅使用CSS预加载

body:after{
    position:absolute; z-index:-1;
    content: url(bg1.png) url(bg2.png) url(bg3.png);
}