2

我在使用 youtube 视频时遇到的问题是右上角的“关闭 x”按钮不在 youtube 视频的顶部。由于某种原因，它卡在它们下面。我已经在所有浏览器中尝试过，看看它是否只是一个 IE 问题，但它似乎发生在所有 youtube 视频上。

我也进入了 .css 并将 z-indext 更改为如此疯狂的高数字，看看它是否会修复它但没有运气，有人遇到过这个问题吗？它似乎仅与 youtube 视频隔离。

4

2 回答 2

2

这是因为 youtube 使用的 flash 播放器不会在默认窗口模式下尊重 CSS 的 z-index 值（参数名称是 wmode）

嵌入 youtube iframe 时，将wmode=opaque参数添加到 URL（wmode=transparent 也可以），所以它看起来像这样：

<iframe width="420" height="315" src="http://www.youtube.com/embed/<youtbue_id>?wmode=opaque" frameborder="0" allowfullscreen></iframe>
于 2012-07-23T20:12:49.913 回答
1

@complex857 是对的，您需要更改wmode设置（到opaque）。

最好的方法是：

1）。从这里获取最新版本的fancybox（和助手）https://github.com/fancyapps/fancyBox/tree/master/source

2）。除了常规的 fancybox css 和 js 文件，添加 fancybox-media helper js 文件，例如（检查您自己的路径）：

<script type="text/javascript" src="fancybox2.0.6/helpers/jquery.fancybox-media.js"></script>

3）。这个新版本允许您通过自定义脚本将特定参数传递给 youtube，例如：

   $(document).ready(function(){
    $(".fancybox").fancybox({
        // other API options here
        padding: 0, // optional
        // set helpers media
        helpers : {
         media : {}
        },
        // NEW youtube media settings
        youtube : {
         autoplay    : 0, // 1 = will enable autoplay
         wmode       : 'opaque'
        }
    }); // fancybox
   }); // ready

注意：这是为 fancybox v2.0.6+

于 2012-07-23T20:35:17.743 回答