如何使用Youtube的HTML5 iframe API设置wmode = opaque?

Ada*_*onR 17 youtube api html5

我正在通过使用javascript API在网站中嵌入Youtube的实验性HTML5 iframe功能:

<ifram>嵌入的YouTube播放器API参考

我知道的z-index的问题,这带来,并涉及添加的wmode =不透明(或的wmode =透明)到iframe网址修复:

固定.我的Youtube iframe z-index被忽略,高于固定的div

刚使用javascript API时,如何将wmode设置为opaque:

function onYouTubePlayerAPIReady() {
    var player;
    player = new YT.Player('player', {
        width: 1280,
        height: 720,
        videoId: 'u1zgFlCw8Aw',
        // if I try adding wmode: opaque here, it breaks
        playerVars: {
            controls: 0,
            showinfo: 0 ,
            modestbranding: 1
            // if I try adding wmode: opaque as a playerVar here, it breaks
        },
        events: {
            'onReady': onPlayerReady,
            'onPlaybackQualityChange': onPlayerPlaybackQualityChange
        }
    });
 }
Run Code Online (Sandbox Code Playgroud)

有任何想法吗?

Ada*_*onR 71

Hmmmm ...

好吧,我似乎仓促地发布了这个问题.似乎在API中设置wmode的正确形式是:

function onYouTubePlayerAPIReady() {
    var player;
    player = new YT.Player('player', {
        width: 1280,
        height: 720,
        videoId: 'u1zgFlCw8Aw',
        playerVars: {
            controls: 0,
            showinfo: 0 ,
            modestbranding: 1,
            wmode: "opaque"
        },
        events: {
            'onReady': onPlayerReady,
            'onPlaybackQualityChange': onPlayerPlaybackQualityChange
        }
    });
 }
Run Code Online (Sandbox Code Playgroud)

希望这有助于其他人.