iframe 内容不响应 IE 中的 wmode

Posted 2023-05-09

【中文标题】iframe 内容不响应 IE 中的 wmode

【英文标题】：Iframe content not responding to wmode in IE

【发布时间】：2015-09-05 06:45:19

【问题描述】：

我有一个 Bootstrap 项目，其中包含有关点击事件的视频。在所有浏览器上加载视频都可以正常工作，但无论我做什么，我都无法让 iframe 内容显示在 IE 中的其余网站内容下方（即使是最新版本）。我到处搜索并尝试了 wmode=opaque 或 transparent 的所有变体，但似乎没有任何效果。

任何帮助将不胜感激 - 谢谢！

代码如下： html：

<div class="video-container" data-url="https://www.youtube.com/embed/OPf0YbXqDm0">
            <img class="posterframe" src="img/video-poster-frame.gif"  />
          </div>

jQuery:

var videos  = $(".video-container");
    videos.bind("click", function()
        var url = $(this).data('url');
        var elm = $(this),               
        ifr     = '<iframe   frameborder="0" allowfullscreen src="' + url + '?wmode=opaque?rel=0&autoplay=1"></iframe>';
        elm.addClass("player").html(ifr);
        elm.off("click");
    );

【问题讨论】：

看看这是不是你要找的东西 - scorchsoft.com/blog/youtube-z-index-embed-iframe-fix

不确定它是否会影响 wmode 但替换“？”用“&”表示“rel=0”

就是这样！！我之前尝试过使用“&”，但是替换了所有的“？”，但它没有用 - 只是在一个实例中替换它似乎已经成功了 - 非常感谢:-)

是的，有时我们遇到了一个简单的问题！！很好，对你有用！

【参考方案1】：

为了以后参考，把更新的jQuery代码sn-p放上去。

$(".video-container").bind("click", function()
    var url = $(this).data('url');
    var elm = $(this),               
    ifr     = '<iframe   frameborder="0" allowfullscreen src="' + url + '?wmode=opaque&rel=0&autoplay=1"></iframe>';
    elm.addClass("player").html(ifr);
    elm.off("click");
);