Question

我有一个菜单栏，里面有几个子菜单项。主页包含位于菜单栏下方的flash动画。当子菜单项位于Flash文件上时，Flash文件将显示在菜单栏上。我尝试使用z-index，但它不起作用。

此问题仅发生在IE中。

任何提示？

由于

Answer 1

是克里斯，

您必须将属性设置为flash嵌入代码

<param name="wmode" value="transparent" />

这将有效

Answer 2

在插入Flash文件的位置，您需要将窗口模式设置为透明：

<embed src="flashfile" wmode="transparent">

Answer 3

Muneer和Tim已经给出了一个很好的答案，但我想补充一些额外的信息：

Adobe的网站上有关于Flash OBJECT and EMBED tag attributes
transparent和opaque值会导致可访问性问题，导致它们将Flash对象的内容隐藏到屏幕阅读器。屏幕阅读器只有window的默认值
z-index在你的情况下不会也不能做任何事情：对象由插件，flash播放器或替代方案管理，并且它完全在浏览器呈现的页面之外。它仍然与它（宽度，高度，JS）相互作用，但是对于渲染......
IE6（和7？）中的select元素存在类似的问题，其中定位元素上的z-index值不会在select上呈现后者（由于IE认为选择元素的方式，这是一个错误）
你应该在OS X和Linux上进行测试，这些操作系统上有很多关于flash的问题。

Answer 4

有一个更好的解决方案，因为添加该参数并不总是有效，特别是在div中使用flash对象时。

在页面的末尾注册flash对象，如下所示：

<script type="text/javascript">
    swfobject.registerObject('FlashIdName');
</script>

然后像这样调用一个javascript函数：

<script type="text/javascript">
    swfobject.registerObject('FlashIdName');
    Chk_Flash('FlashIdName');
</script>

此功能执行以下操作：

<script type="text/javascript">
function Chk_Flash(ToRegister)
{
   document.getElementById('FlashIdName').style.visibility = 'visible';
   return true;
}
</script>

这适用于所有浏览器100％

您也可以使用：

document.getElementById('FlashIdName').style.visibility = 'hidden';

现在，如果你在div标签上调用动作，例如：

document.getElementById('MyDiv').style.visibility = 'block';

或 document.getElementById（'MyDiv'）。style.visibility ='none';

你需要做的是先做div动作，然后按顺序调用flash visibilty：

document.getElementById('MyDiv').style.display = 'block';
document.getElementById('FlashIdName').style.visibility = 'visible';

享受！

Answer 5

使用这些值代替'transparent'：

wmode="opaque"

Answer 6

我终于找到了一个适用于所有浏览器的解决方案。

如果我用过

<param name="wmode" value="transparent" />

，我会在IE上获得所需的输出但不在Firefox上，如果我使用

<embed wmode="transparent" ></embed>

，我在firefox中获得了所需的输出但不是ie。

所以我决定使用两种适用于所有浏览器的方法

 <!--[if IE]>
    <param name="wmode" value="transparent" />
 <![endif]-->

 <embed wmode="transparent" ></embed>

在IE中插入div over flash

6 个答案: