Как установить 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.