javascript - swfobject.embedSWF youtube 视频覆盖在 chrome 中，不透明度不起作用

Question

我在使用 chrome 中的 YouTube 叠加视频时遇到问题，叠加层的不透明度为 0.8，但在 Chrome 中，YouTube 视频也应用了不透明度，因此您可以看穿它。

我在此任务中使用 swfobject.embedSWF 和 ProtoTube 插件，但无法弄清楚为什么会发生这种情况，有什么想法吗？

函数是:

getVideoEmbed: function(wrapper) {
        var wrapperID = wrapper.identify();
        var flashvars = {
            fs: this.options.fs,
            autoplay: this.options.autoplay,
            loop: this.options.loop,
            hd: this.options.hd,
            showinfo: this.options.showinfo,
            rel: this.options.rel

        };
        var params = { 
            wmode: "transparent",
            allowScriptAccess: "always",
            allowFullScreen: true,
            menu: false
        };
        var atts = { };
        swfobject.embedSWF(this.options.youtubeVideoUrl+this.videoID, wrapperID, this.options.playerWidth, this.options.playerHeight, "9", null, flashvars, params);
    },

问题的示例 URL 可在此处找到:http://tinyurl.com/b48u39c (点击chrome主图上的播放视频链接可以看到问题)

Answer 1

在 Firefox 16.0.2 和 IE 9 中使用 {opacity: 0.8} 的电影看起来与 Chrome 23 中的完全一样(半透明，图像和文本可见)。在 Opera 12.02 中，电影看起来有点漂白(混合了大量的白色)。

恕我直言，这不是 Chrome 的特定错误。这是浏览器的行为 - 以某种方式将元素的不透明度应用于嵌套对象(因为 object 嵌套到您的 div class="overlay" 中)。

更新:将您的 swf 播放器放置在 div class="overlay" 具有更高的 z-index(例如 {z- index: 5001;，不在覆盖层的内部。