我通过使用JavaScript API将YouTube的实验性HTML5 iframe功能嵌入到网站中:
YouTube Player API Reference for <ifram> Embeds
我知道这带来的z-index问题,并且涉及在iframe url中添加wmode = opaque(或wmode = transparent)的修补程序:
Fixed. My Youtube iframe z-index is ignored and is above a fixed 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 } }); }
有任何想法吗?
解决方法
Hmmmm …
嗯,看来我很仓促地提出了这个问题。在API中设置wmode的正确形式似乎是:
function onYouTubePlayerAPIReady() { var player; player = new YT.Player('player',playerVars: { controls: 0,modestbranding: 1,wmode: "opaque" },'onPlaybackQualityChange': onPlayerPlaybackQualityChange } }); }
希望这有助于别人。