Question

您好我在网站内嵌了YouTube视频，但是当我点击按钮获取叠加层时，叠加层会落后于YouTube视频。这只发生在Firefox 14中，它在其他任何地方都能正常工作......我试图把wmode =“transparent / opaque”但是它不适用于其中任何一个......

重叠框代码：

.box_4, .box_5, .box_6 {
  position: fixed;
  top: -1900px;
  left: 50%;
  z-index: 101;
  width: 883px;
  margin-left: -400px;
  }

Answer 1

问题在于您嵌入了YouTube链接：

https://www.youtube.com/embed/kRvL6K8SEgY 在iFrame中，默认的wmode是窗口化的，它基本上为它提供了比其他所有内容更大的z-index，它将覆盖任何东西。

尝试将此GET参数附加到您的网址：

WMODE =不透明

像这样：

https://www.youtube.com/embed/kRvL6K8SEgY?wmode=opaque

确保它是URL中的第一个参数。其他参数必须在

之后

在iframe代码中：

示例：

<iframe class="youtube-player" type="text/html" width="520" height="330" src="http://www.youtube.com/embed/NWHfY_lvKIQ?wmode=opaque" frameborder="0"></iframe>

请参阅：overlay opaque div over youtube iframe

Answer 2

尝试使用position: absolute -

.box_4, .box_5, .box_6 {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 9999;
  width: 883px;
  margin-left: 0px;
  }

Answer 3

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

尝试这个参数，它应该修复它。

问候和祝你好运......

HTML叠加在youtube视频后面

3 个答案: