首页 文章

Youtube iframe wmode问题

提问于
浏览 次
133

使用jQuery和jQuery，我添加一个带有youtube网址的iframe来在网站上显示视频但是从youtube加载到iframe中的嵌入代码没有wmode =“Opaque”，因此页面上的模式框显示在youtube视频下方 .

任何想法如何解决问题？

iframe youtube wmode

9 回答

  • 8

    尝试将 ?wmode=opaque 添加到URL或 &wmode=opaque （如果已有参数） .

    如果它不起作用，请尝试使用 &wmode=transparent ，它也适用于IE浏览器 .

    回复于
  • 81

    尝试将 ?wmode=transparent 添加到URL的末尾 . 为我工作 .

    回复于
  • 0

    如果您使用的是新的异步API，则需要添加如下参数：

    <!-- YOUTUBE -->
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "http://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

// 3. This function creates an <iframe> (and YouTube player)
//    after the API code downloads.
var player;
var initialVideo = 'ApkM4t9L5jE'; // YOUR YOUTUBE VIDEO ID
function onYouTubePlayerAPIReady() {
    console.log("onYouTubePlayerAPIReady" + initialVideo);
    player = new YT.Player('player', {
      height: '381',
      width: '681',
      wmode: 'transparent', // SECRET SAUCE HERE
      videoId: initialVideo,      
       playerVars: { 'autoplay': 1, 'rel': 0, 'wmode':'transparent' },
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
}

    这是基于谷歌文档和示例：http://code.google.com/apis/youtube/iframe_api_reference.html

    回复于
  • 0

    添加 ?wmode=opaque 到URL似乎为我解决了这个问题，虽然我还没有在IE中测试它 .

    对于那些对之前提出的解决方案有困难的人，请注意，只有在您已经为URL提供其他参数时，初始符号才会起作用 . 第一个参数必须有一个初始问号： http://www.example.com?first=foo&second=bar

    回复于
  • 237

    将 &amp;wmode=transparent 添加到网址，您就完成了测试 .

    我在自己的wordpress插件中使用该技术YouTube shortcode

    如果遇到任何问题，请检查其源代码 .

    回复于
  • 18

    只是一个提示！ - 确保你想要在嵌入式视频上的元素上的z-index . 我添加了wmode查询字符串，它仍然无效......直到我提升了另一个元素的z-index . :)

    回复于
  • 0

    &wmode=opaque 对我不起作用（chrome 10）但 &amp;wmode=transparent 清除了问题 .

    回复于
  • 3

    我知道这是一个老问题，但它仍然出现在这个问题的热门搜索中，所以我添加了一个新的答案来帮助那些寻找IE的人：

    将 &wmode=opaque 添加到URL的末尾在IE 10中不起作用...

    但是，添加 ?wmode=opaque 就可以了！

    在这里找到这个解决方案：http://alamoxie.com/blog/web-design/stop-iframes-covering-site-elements

    回复于
  • 1

    最近我看到有时flash播放器无法识别 &wmode=opaque ，你也应该通过 &WMode=opaque （注意大写） .

    回复于

相关问题