优雅加载网页的提示？

我有一个网页，当页面处于各种状态时，使用jQuery / javascript隐藏/显示/设置了大量内容。我遇到了一个问题，在页面的初始加载时，我的所有内容都会以一种可怕的方式显示，只需几分之一秒，然后对页面加载进行样式/隐藏/显示。

任何人都可以推荐任何技术，以更优雅的方式完成页面的初始加载吗？

这被称为FOUC一种没有风格的内容。

一种相当标准的方法是默认在css中隐藏内容，然后一旦使用javascript完成所有操作再次显示元素。

但是，您可以考虑尝试progressive enhancement以使javascript能够为您的网站添加function，而不是依赖于function和外观，而不是针对graceful degradation 。
请看这里有关这两种方法的相对优点的好博客文章。

使用CSS将初始显示状态设置为隐藏（ display:none或visibility:hidden ，视情况而定）和jQuery / JavaScript以便稍后显示（通过直接样式或更改类以显示它们）。

您可以将CSS display:none和visibility:hidden默认设置为隐藏元素。

如何在页面加载完成时添加叠加并隐藏它？ :)尝试添加一个带有id覆盖的div，或者由你决定，并将它设置为：

 #overlay{ width:100%; height:100%; position:fixed; top:0; left:0; z-index:99 }

这将隐藏您的所有内容。在网页加载完成后，用jquery隐藏它：

 $(window).load(function(){ $('#overlay').animate({opacity:'0'}).css('zindex','-10'); })