IE站点导航页面闪烁答案

【问题标题】：IE Site Navigation Page FlickerIE站点导航页面闪烁
【发布时间】：2014-07-05 14:22:24
【问题描述】：

所以我遇到了一个问题，我的页面在网站导航时闪烁。 IE，当我单击标题中的链接时，页面在渲染之前会短暂闪烁为白色。这仅发生在 IE（当前使用版本 11）中，而它似乎在 Chrome 和 Firefox 中缓存良好。

这是该网站的链接：Kelsey's Kreations。

这是我页面头部的代码：

<head>
  <title>Flavors - Kelsey's Kreations</title>

  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0">
  <!--[if IE]><script>document.createElement('main');</script><![endif]-->

  <script src="http://use.typekit.net/dxe8zqc.js"></script>
  <script>try{Typekit.load();}catch(e){}</script>

  <link rel="stylesheet" href="../css/style.css">
  <link rel="stylesheet" href="../css/fa.css">

</head>

这是我页面底部的代码：

  ...
  <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
  <script src="../js/header.js"></script>
</body>

我已经尝试过“Page-Enter”黑客，但它们似乎在 IE9 中已被弃用。

我尝试将js移到页面底部，但是头部的脚本必须保留，否则会导致所有浏览器出现其他问题。

【问题讨论】：

我没有看到任何闪烁。它可能是一个视频卡，但怀疑它。也可能是您的病毒扫描程序干扰了 IE，他们在 IE 中做疯狂的事情。检查您是否处于兼容模式，您可以在 F12 工具中进行检查。您的某些图像偏大，您可能希望优化那些下载速度更快的图像。它们在核心内容呈现后加载。
主要是svg横幅和标题最困扰我。在其他浏览器上浏览网站时，标题保持不变并提供一致的感觉，但在 IE 上它会短暂闪烁白色。

标签： jquery css html internet-explorer caching

【解决方案1】：

尝试将较大的图像（1000 像素的蛋糕球等）保存为“渐进式”jpeg，这样可以加快加载速度。这可能足以消除加载期间的闪烁，而无需更改任何其他内容。

如果闪烁仍然没有消失，您可以在其后面添加背景颜色以减轻其影响。

也看看这里： http://css-tricks.com/snippets/html/stop-ie-page-load-flicker/

如果所有其他方法都失败了，我想你会加入我们其他人的行列，在 IE 方面权衡我们的选择，并让它尽可能好地降级。

【讨论】：

不走运。我将图像设置为渐进式，页面仍然在 IE 上闪烁。