firefox flash wmode 直接 z-index 透明背景答案

【问题标题】：firefox flash wmode direct z-index transparency backgroundfirefox flash wmode 直接 z-index 透明背景
【发布时间】：2014-06-16 16:49:59
【问题描述】：

我在 仅限 Windows 上遇到 Firefox 28 和 29 的这个问题（在 OSX 上运行 Chrome、Safari、Firefox 以及在 Windows 上运行 IE 和 Chrome）

我有一个带有 透明背景 和 swf 对象的 html 模态框。背景位于 flash 对象的后面，但模态内容正确地位于所有内容的前面。如果我将背景不透明度设置为 1，它工作正常。

我正在使用 wmode='direct' 并且我无法更改它，因为 3d 库需要将 wmode 设置为“direct”

这基本上是代码的样子：

<body>
    <object type="application/x-shockwave-flash" id="Main" name="Main" align="middle" bgcolor="#fff" data="main.swf" width="100%" height="100%" style="z-index:100;">
        <param name="quality" value="high">
        <param name="bgcolor" value="#fff">
        <param name="wmode" value="direct">
        <param name="flashvars" value="myVars">
    </object>
    <div class="fancybox-overlay fancybox-overlay-fixed" style="background: rgba(0, 0, 0, 0.8);z-index:150;">
        <div class="fancybox-wrap fancybox-desktop fancybox-type-ajax fancybox-opened" style="z-index:160;">
            <div class="fancybox-skin">
                <div class="fancybox-outer">
                    <div class="fancybox-inner" >
                        My Modal Box Content
                    </div>
                </div>
                <a title="Close" class="fancybox-item fancybox-close"></a>
            </div>
        </div>
    </div>
</body>

关于这个有什么想法吗？

感谢您的宝贵时间，

乔里斯

【问题讨论】：

请您发布 CSS/jsfiddle/page URL 它将有助于调试代码
嗨，你有没有找到解决这个问题的方法？我仅在 Firefox/Windows 7 和 8 中遇到完全相同的问题。谢谢！

标签： html css flash firefox

【解决方案1】：

如果 wmode 设置为 direct、window 或 gpu 值，则不能在 Flash 对象上使用 HTML 覆盖。对于这些wmode，Flash 在大多数浏览器中不支持 HTML 分层。

看表https://helpx.adobe.com/flash/kb/flash-object-embed-tag-attributes.html#main_Browser_support_for_Window_Mode__wmode__values

L = 支持 HTML 分层。 HTML 元素可以与 SWF 内容重叠。支持显式控制与其他 HTML 元素相关的分层。

【讨论】：