0

我在将 DIV 中的文本覆盖在 Flash 对象之上时遇到了一个奇怪的问题。我知道 WMODE 参数是 IE 9 及以下版本的关键,我能够使用此代码使其在 FF、Safari、IE 8 和 9 等中正常工作(我没有使用 z-index 或任何东西在我的 CSS 中,只是绝对定位):

<!--[if IE]>
<object width="960" height="280" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
   <param name="movie" value="/assets/flash.swf">
   <param name="wmode" value="opaque">
<![endif]-->

<!--[if !IE]>-->
<object width="960" height="280"
        data="/assets/flash.swf"
        type="application/x-shockwave-flash">
<!--<![endif]-->
    <img src="image.jpg" />
</object>
<div class="copy-left" >
    <h2 style="color:#FFFFFF">Title</h2>
    <p style="color:#FFFFFF">Text 2</p>
</div>

但出于某种原因,在 IE 10 和 11 中,div 出现在 Flash 影片的后面,而不是在它的顶部……好像 WMODE 根本不重要,并且对象仍然希望出现在所有东西的顶部。

我会很感激任何想法,我很难过。

4

1 回答 1

1

事实证明,IE 10+ 不注意条件注释,所以 wmode 被忽略了。

我通过添加到这两个对象来修复它<param name="wmode" value="opaque">,无论它们是否是 IE。最终代码是这样的:

<!--[if IE]>
<object width="960" height="280" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
   <param name="movie" value="/assets/flash.swf">
   <param name="wmode" value="opaque">
<![endif]-->

<!--[if !IE]>-->
<object width="960" height="280"
        data="/assets/flash.swf"
        type="application/x-shockwave-flash">
        <param name="wmode" value="opaque">
<!--<![endif]-->
    <img src="image.jpg" />
</object>
<div class="copy-left" >
    <h2 style="color:#FFFFFF">Title</h2>
    <p style="color:#FFFFFF">Text 2</p>
</div>
于 2013-08-15T21:52:37.560 回答