Flash 重叠/wmode 问题答案

【问题标题】：Flash overlapping / wmode IssueFlash 重叠/wmode 问题
【发布时间】：2012-02-16 17:42:27
【问题描述】：

我在 Google Chrome (16.0.912.75 m) 和 Safari (5.1.1) 中遇到了众所周知的 flash / html 覆盖问题。正如here 和here 所建议的那样，我已将wmode 属性设置为transparent - 并尝试了opaque。不幸的是，两者都没有成功。

我还添加了type="application/x-shockwave-flash"，就像建议的here

这是当前负责嵌入的代码。

<iframe wmode="transparent" type="application/x-shockwave-flash" 
    width="760" height="427" 
    src="http://www.youtube.com/embed/Xedbog6_3L0?rel=0&hd=1?wmode=transparent" 
    frameborder="0" allowfullscreen=""/>

【问题讨论】：

标签： html flash google-chrome z-index wmode

【解决方案1】：

首先，这个问题在 Safari 5.1.2 和 Firefox 9.0.1（Mac 版本）中不复存在。在不了解您的浏览器的情况下，我只能说，由于您使用 iframe 标记来指向实际嵌入 Flash 的页面，wmode 在您当前的 DOM 文档中无效，因为它不是 @ 的有效属性987654324@ 标签（属于embed 标签）。您需要将 iframe 标签上的 css 属性 display 设置为 block 值，以使浏览器将您的 iframe 视为标准布局对象。然后，您可以通过 CSS 设置图层的分布和定位。

【讨论】：

非常感谢。我不知道 wmode 属性对 iframe 无效。哎呀。 ...我已将 display: block 设置添加到 iframe 并将 z-index 显式设置为 0（导航具有 z-index: 99）。非常感谢任何进一步的建议。（我已经添加了上面的浏览器版本）。
更新：由于您的帮助，我找到了这个 (stackoverflow.com/questions/3820325/…) 并解决了这个问题。谢谢。