布局阶段完成后显示 HTML 内容

Question

我希望在所有内容都可用并在网页中正确定位后显示内容。大多数预加载器技术只考虑下载时间，而不考虑渲染时间，因此让用户看到正在构建的页面。虽然很短，但很明显。我在本机应用程序中使用 WebKit，但这并不重要。

在页面完全准备好之前延迟内容显示的正确方法是什么？

Answer 1

如上所述，您最初可以将所有内容设计为visibility:hidden

<div id="content" style="visibility:hidden">
   <!-- all your content 
        (won't be displayed, as long as they are not explicitly
         visibility:visible) -->
</div>

取消隐藏所有内容的 JavaScript 非常简单：

function unhide() { document.getElementById("content").style.visibility = ""; }

要在加载所有内容时调用它，请使用该load事件：

document.addEventListener('load', unhide, false);

我认为 jQueryready()处理程序实际上会监听DOMContentLoaded现代浏览器中的事件，因此它会在加载图像之前运行。如果您只需要在显示所有内容之前固定布局，则可以使用ready()或DOMContentLoaded，但请务必在 HTML 中显式指定图像尺寸。