将 div 的部分内容覆盖在 flash 上答案

【问题标题】：overlay parts of div over flash将 div 的部分内容覆盖在 flash 上
【发布时间】：2011-01-11 10:33:45
【问题描述】：

通常可以使用“wmode transparent”参数解决，但在 Firefox 中我有一个奇怪的问题。当我用 div 的一部分覆盖 flash 元素时 div 渲染得很奇怪（就像 flash 元素边界的楼梯）

http://img522.imageshack.us/i/bildschirmfoto20110111u.png/

灰色区域（和上面的一个小透明区域）是闪光元素。大纲是带边框的 div。

该错误仅发生在 FF（我有 3.6）chrome/safari 工作正常...

代码：

它是一个 swfobject 实现。覆盖的 div/ul 位于闪存包装器。

        <div id="flash-wrapper">
            <object width="740" height="500" type="application/x-shockwave-flash"
            data="/flash/photobook.swf?1295004511635" id="photobook-wrapper" style="visibility: visible;">
            <param name="wmode" value="transparent">
            <param name="flashvars" value=""></object>
        </div>

        #flash-wrapper {
            height: 500px;
            position: relative;
            width: 740px;
        }


        <ul id="frame_options_select-menu" style="z-index: 0; top: 213px; left: 388px;">
            <li class=""><a href="#" id="ui-selectmenu-item-74">Cover: full size photo</a></li>
        </ul>

        element.style {
            left: 388px;
            top: 213px;
            z-index: 0;
                -moz-border-radius: 6px 6px 6px 6px;
                visibility: visible;
            -moz-border-radius: 0 0 0 0;
            background: none repeat scroll 0 0 #08A0D9;
            border: 1px solid #08A0D9;
            list-style: none outside none;
            margin: 0;
            overflow: auto;
            padding: 0;
            position: absolute;
            top: 0;
            visibility: hidden;
            z-index: 1005 !important;       
        }

【问题讨论】：

您能否将我们链接到一个实时示例或提供一些代码来查看？用这个回答会容易得多:)
好的，我在问题中粘贴了一些代码。我使用 swfobject 来实现 flash。
sry 我尝试在网上发布一个示例，但无法重现该错误。现在解决了:)

标签： html css flash

【解决方案1】：

好的，调试起来很复杂，但我找到了答案：

我有以下代码：

    <div id="page">
      <div id="flash-wrapper">
        flash object
      </div>
    </div>

    #flash-wrapper {
        height: 500px;
        position: relative;
        width: 740px;
    }

    #page {
        width: 700px;
    }

问题是页面 div。如果我将宽度更改为 800px，它工作正常。如果宽度低于 flash-wrapper 的宽度，我会得到楼梯效果。

因此：父 div 不能小于对象标签。（通常它不应该是反正）。 “溢出：隐藏；”不能解决问题。

【讨论】：

【解决方案2】：

我遇到了 Flash 出现在我的弹出式菜单前面的问题。我尝试了两种不同的元素 z-index 重新排序技术，它们仅适用于 IE10。

今天早上，我尝试了适用于所有 IE 版本的方法，最低到 7。

http://willstechcafe.wordpress.com/2013/06/20/overlays-vs-flash/

【讨论】：