Mobile 移动狩猎白色背景

我正在专门为iPad/mobile Safari创建一个web应用程序。主页是一个普通的HTML/CSS页面，有3个主要部分。但是，一旦你点击3个主按钮中的任何一个，你就会被引导到一个由2个iFrame构成的页面（一个在顶部用于导航，一个在底部用于内容）

问题是，在加载这3个页面之前，有一个白色的快速闪光，然后加载页面。我试着隐藏iframe的可见性样式，然后将其onLoad更改为“visible”，结果成功了。但当iFrame构建的页面第一次加载时，它只工作了一次。一旦它加载了，我点击了页面上的链接，白色的闪光就会回来，因为iFrame已经加载了，所以它已经可见了

我尝试了一些显而易见的方法，比如在iframe中添加一个带有背景色的css样式（也尝试了内联样式），但同样的事情发生了。有没有办法解决这个问题？谢谢

你可以这样做：

<iframe src="..." style="visibility:hidden;" onload="this.style.visibility='visible';"></iframe>

说明：

• 第一次，您的iframe是隐藏的，您可以看到主页的背景（而不是iframe的白色）
• 加载后，Javascript将使iframe可见，您可以看到iframe的内容和背景
• 当单击iframe内的链接时，将触发触发器，Javascript将再次隐藏iframe

---

我遇到了那个问题，花了整整一天的时间试图解决，但我不能不这样做。你可以在Chrome、Firefox和其他浏览器上遇到这个问题，而不仅仅是在Safari Mobile上。

我认为KimKha也是如此。但“可见性”有时并不好用，所以我认为使用“不透明度”更好

<iframe src="..." style="opacity:0;" onload="this.style.opacity=1;"></iframe>

---

我遇到了这个问题，找到了很多类似KimKha提到的解决方案

没有一个解决方案可以帮助iframe中的进一步页面转换，隐藏它并不是一个好的解决方案

通过大量的跟踪和错误，我提出了以下解决方案，解决了我的IOS webkit iFrame过渡白色闪存问题，具有讽刺意味的是，这是一个如此简单的解决方案：

只需将此添加到CSS中

html{background:#000}

将颜色更改为所需的颜色

IOS webkit的最终问题似乎是，当您的iframe调用另一个页面时，IOS会在呈现新页面内容之前的一瞬间从当前页面删除正文。通过强制HTML使用背景色（默认为白色），这修复了白色闪烁

另外请注意，如果服务器设置为不允许缓存提供样式的.css文件，那么您将始终得到闪烁

在apache中确保缓存

ExpiresByType text/css "access plus 30 days"

---

有保密协议，所以我不能把它放在视图上。我解决了它。这不是一个优雅的解决方案，但在iFrame中添加第二个内容（也只有在加载时才可见）可以解决白色闪烁的问题。没有理由将该内容放在iFrame上，但它解决了问题。谢谢

ExpiresByType text/css "access plus 30 days"