固定位置背景 - Chrome问题

我最近组合了一个使用固定图像的背景，并在文本上滚动文字。当我使用chrome（而不是其他任何浏览器）时，滚动在背景之间停止工作，暂停大约一秒钟，然后继续。我不知道如何解决这个问题，所以任何建议表示赞赏。固定位置背景 - Chrome问题

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

来源

2017-08-10 A. Pollack

我已经试过了，它能正常工作与我的谷歌浏览器！没有停顿。 – ziMtyth

你可以试着快速浏览它吗？ –

我正在使用版本60.0.3112.90（官方版本）（64位）。没有一个问题，请确保Chrome是最新的。还测试了FireFox，Opera，Safari以及移动Safari和Chrome和FireFox手机，没有问题。 – Brxxn

在测试了Chrome和有同样的问题。当你滚动的东西被加载时（延迟加载原理但可能有点不同），它可能是可能的吗？

来源

2017-08-10 15:21:15

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

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

尝试减少图像的大小，或与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); 
}

来源

2017-08-10 15:25:11 Jiayang

我如何预加载CSS中的图像？ –

@ A.Pollack我编辑了答案。你可以试试。 – Jiayang

固定位置背景 - Chrome问题

回答

相关问题