iframe内容没有响应IE中的wmode

时间:2015-06-19 10:10:20

标签: jquery internet-explorer iframe z-index

我有一个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" alt="Video placeholder image" />
          </div>

jQuery的:

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

1 个答案:

答案 0 :(得分:0)

供将来参考,放入更新的jQuery代码片段。

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