iPhone的YouTube视频z-index

Question

我在网页中嵌入了一个YouTube视频。同时，我的菜单（展开后）在该视频的上方。

我将菜单的z-index值设为高于视频的值。我还将视频的wmode设置为transparent，以允许其上方的内容。

在我的电脑上，使用safari、ie、chrome或firefox都没有任何问题（菜单在视频上方，正如它应该出现的位置）。但是，在iPhone和iPad上，flash内容被一个大的可点击的YouTube按钮所代替，该按钮会在YouTube应用程序中打开嵌入式的YouTube视频，并且该按钮位于菜单的上方。有谁知道如何解决这个问题吗？

谢谢！

- Yuval Karmi

Answer 1

我不确定这是否是您所需要的。在jsbin.com上提供一个实时示例将有所帮助。无论如何，我希望以下内容对您有用。 您可以使用youtube提供的iframe方法播放其视频。如果浏览器支持html5，则会使用html5显示视频；否则，会使用flash。此外，它可以在iphone / ipad上完美播放，而无需打开iphone / ipad应用程序。 您可以使用以下代码作为示例：

- Sotiris

Answer 2

iPad和iPhone不支持显示Flash内容，它们使用视频的h.264版本。

因此，实际播放内容的是完全不同的插件，设置Flash文件的Wmode也没有任何影响。

编辑 我已经查找过了，对于iPad / Safari / iPhone问题，我没有解决方案。

- Wes

---

有没有办法将它放在网站菜单下面（z-index）？ - Yuval Karmi

Answer 3

我也遇到了这个问题。在代码中添加参数"wmode=transparent"之后，问题得到解决。 <iframe width="480" height="360" src="http://www.youtube.com/embed/111111?wmode=transparent" frameborder="0" allowfullscreen></iframe>

- qbaby1728

Answer 4

我怀疑用于切换内容的应用程序正在内联设置z-index级别。我将查找该元素的id（按钮或其容器）并将z-index设置为低于菜单z-index。确保在值之后包含“!important”，以确保它覆盖内联样式。

- Stuart Burrows