Question

我创建了一个Wordpress主题，但是在页面加载方面遇到了问题。当我在页面之间移动时，标题中有一个表（带有2个图像），当所有其他元素都被卸载时，该表位于页面后面。任何想法如何解决这个问题，以便此图像仅与页面的其余部分一起显示？

请参阅http://thetaonline.co.za/newWeb/并点击每个菜单项以查看剩余的图像（在页面其余部分之前加载）。

Answer 1

你的HTML代码搞砸了。它在<table>之前打开<html>，在</html>之后关闭。这些内容应该放在<body>...</body>区域内。

这基本上是在页面加载完成之前显示它的原因，因为使用<script src=...或<link href=...调用的外部资源将挂起页面呈现，直到它们被加载。这就是为什么这些东西通常在所有内容之前被调用的原因，在<head>...</head>块内，其中（或者应该）仍然没有为显示定义。

Sinse你做错了，它会显示准备渲染的内容 - 基本上只是那个图像 - 直到其余部分被加载。

将外部资源调用放在<head>块中，似乎是正确的，所以基本上你只需将该表放到正确的位置即可正确显示页面。

我发现也存在一些可能导致问题的拼写错误，例如<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US"最后错过>等。您应该检查一下代码。

Answer 2

尝试使用jquery并执行以下操作：

  $(function() {
    $.preload(["image1.png", "image2.png"]);
  }

Answer 3

编辑：你应该看看Havenard的答案！

我不知道，如果这是一个好主意（我猜它不是！），但你可以先隐藏这些图像，然后在页面完全加载后用jquery显示它们：

<table width="35" border="0" cellspacing="0" cellpadding="0" style="display:none" id="specialimages">
<!-- your 2 images in here -->
</table>

<script type="text/javascript">
$(document).ready(function() {
    $('#specialimages').show();
});
</script>

一个图像在页面的其余部分之前加载

3 个答案: