Как установить wmode = opaque с помощью Youtube HTML5 iframe API?
Я внедряю Youtube экспериментальные возможности HTML5 iframe на веб-сайте с помощью javascript API:
Ссылка на API YouTube Player для <ifram> Встраивание
Мне известны проблемы с z-index, которые возникают, и исправление, которое включает добавление wmode = opaque (или wmode = transparent) к URL-адресу 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
}
});
}
Любые идеи?
Ответы
Ответ 1
Хммм...
Ну, похоже, я поспешил опубликовать вопрос. Похоже, что правильная форма для установки wmode в API:
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
}
});
}
Надеюсь, это поможет кому-то другому.
Ответ 2
Насколько я могу судить, по умолчанию это opaque
. Я тестировал изменение wmode
на transparent
, opaque
и удалил его. Когда он не был указан, он автоматически был установлен на opaque
.
Я не уверен, что это всегда так, но это определенно сейчас.
Также помните, что это применимо только при использовании проигрывателя Flash. Вы можете отключить проигрыватель HTML 5, чтобы проверить это по умолчанию с помощью 'Disable Youtube ™ HTML5 Player' плагин. Затем просто проверьте элемент и разверните его, пока не найдете тег EMBED.