IE中的Flash覆盖

Question

我有一个闪存在我的网站上，我想添加一个覆盖，我可以插入HTML。这个想法是，在显示HTML之前，包含闪存的div会将其不透明度提高到0.5。我在谷歌Chrome和Firefox上做得很好，但和往常一样，IE让我头疼。我将wmode设置为不透明(也尝试了透明)，但IE的行为很奇怪。为了使我的div显示在闪光灯视频顶部，我把它的位置设置为绝对，并给予它比任何其他元素更高的z索引。

问题是，IE9没有显示我从jQuery添加到div的HTML。公平地说，我可以在隐藏的div中使用PHP添加它。然而，最大的问题是IE不会让我动画闪存播放器的不透明度，不像Chrome和Firefox (可能还有其他浏览器)，也不允许我与flash播放器交互。当叠加显示时，播放机不再响应当我点击它。

IE需要一些解决方案，但到目前为止，我还没有找到解决不透明问题的方法。现在是密码。

DOM:

<div class="videoPaths" style="z-index: 9999;">
    This is the overlay container
</div>

<div class="videoWrapper">
    <script src="swfobject/swfobject.js"></script>

    <div id="VideoPlayer" class="embedded-video">
        <div class="no-flash">You don't have flash</div>
    </div>

    <script>swfobject.embedSWF("http://url.com/v.swf", "VideoPlayer", "590", "332", "9.0.0", "/swfobject/expressInstall.swf", {}, {wmode:'opaque', allowscriptaccess:'always', allowfullscreen:'true', FlashVars:'token=my_token&photo%5fid=my_id'}, {id:'VideoPlayer', name:'VideoPlayer'});</script>
</div>

JavaScript (jQuery): --为说明目的而简化

// Animate opacity to 0.5
$('.videoWrapper').animate({ opacity: 0.5 }, { duration: 1000, queue: false, complete: function() { showOverlay(); } });

function showOverlay() {
    // Show overlay text
    $('.videoPaths').html('<h2>This is the overlay text I want to show</h2>');
}

CSS:

.videoPaths {
    position: absolute;
    top: 100px;
    text-align: center;
    width: 590px;
}

在上面的代码中，没有显示我所附加的jQuery，但是正如我所说的，我可以通过将它直接添加到DOM中来修复它，因为IE会显示它。然而，我希望不透明动画工作，但IE9不欣赏它。同样，在这样做时，我不能单击播放机启动/停止播放。

有什么想法吗？如有任何建议，将不胜感激。提前谢谢你！

Answer 1

当显示覆盖层时，当我单击它时，播放机将不再响应

是的，当html元素位于swf之上时，就会发生这种情况；swf是模糊的，因此不能与之交互。

"IE不会让我给flash播放器的不透明度动画，不像Chrome和Firefox那样“

IE在动画不透明度方面一般都很差，尤其是IE8 (根据我的经验)。实际上，渲染引擎在以后的版本中似乎变得更糟了。