等到网页完全加载

Question

我一直在寻找这个，但我无法找到任何方法......

我的网页有一个方形纹理作为背景，这个纹理设置为重复以填充背景。 当有人第一次进入我的网站时，纹理会像拼图一样逐个加载每个方块。

有没有办法（任何方式）延迟显示网页直到后台加载？

到目前为止，我发现的唯一一件事就是用onclick事件隐藏和取消隐藏div。

背景的CSS代码：

html { 
background: url(/background.jpg) center center fixed; 
background-repeat: repeat;
position: relative;
}

Answer 1

编辑：我已经添加了更好的解决方案。它比我的第一个建议更简单，更直接。

解决方案2：

您在Javascript中加载背景图片。然后在body元素上设置背景图像（或者你想到的任何元素）。加载图像后，隐藏主要内容上方的加载（微调器）元素。

这里是JSFiddle。

解决方案1（旧且更广泛）：

它更有创意和广泛，但应该完成工作 基本上，您使用HTML5 canvas而不是使用CSS背景。在该画布上，您使用for循环绘制纹理。绘制完所有内容后，您将隐藏 loading 元素来显示您的页面。