1

我一直在尝试使用 jQuery 库来预加载内容，我遇到的常见问题是，一旦预加载了所有内容，它就会显示一个 div，但是在几秒钟内你仍然可以看到“看起来很糟糕”的内容，因为 javascript 不是应用到它，然后它改变它应该是什么样子。很难解释。基本上，一旦加载了整个页面，我就会尝试<div class="text"></div>在页面上显示 div ()，因此图像、javascript 文件等。我在这里找到了非常好的示例

http://tympanus.net/codrops/collective/collective-58/

您可以看到网格/内容仅在所有内容加载完毕后才显示，然后用户会收到加载图像作为等待的指示，这正是我试图实现的目标。我尝试查看源代码，但似乎“预加载”脚本位于其他脚本中的某个位置，并且有很多不必要的代码（对我来说）。那么你能否为这个问题推荐一个轻量级的 jQuery 解决方案？

4

2 回答 2

1

最初用于display:none您的 div 并显示加载 gif。

$(window).load(function() { 
   $('#yourGifID').hide();
   $('#yourDivID').show(); // will be called when everything is loaded
});

load 事件在文档加载过程结束时触发。至此，文档中的所有对象都在 DOM 中，所有图片和子帧都加载完毕。

于 2013-04-10T14:32:49.620 回答
1

对于给您带来麻烦的div，为什么不在html中将其可见性设置为“隐藏”，然后在javascript中，一切准备就绪后，将其更改为“可见”

html:

<div class="text" style="visibility:hidden"></div>

js：

$(".text").css("visibility", "visible");
于 2013-04-10T14:26:29.800 回答