Jak ustawić wmode = opaque przy użyciu interfejsu API iframe HTML5 YouTube?

Question

mam osadzanie iframe eksperymentalne możliwości HTML5 YouTube na stronie internetowej poprzez wykorzystanie API javascript:

YouTube Player API Reference for <ifram> Embeds

Zdaję sobie sprawę z problemów, z-index powoduje to, że poprawki i polega na dodaniu wmode = opaque (lub wmode = przezroczyste) do url iframe:

Fixed. My Youtube iframe z-index is ignored and is above a fixed div

Kiedy tylko przy użyciu javascript API, w jaki sposób ustawić wmode do nieprzezroczysty:

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 
     } 
    }); 
} 

Wszelkie pomysły?

Answer 1

Hmmmm ...

Cóż, wydaje się, że jestem pochopny w zaksięgowaniu pytanie. Wygląda na to, że poprawną formą ustawienia wmode w API jest:

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 
     } 
    }); 
} 

Mam nadzieję, że to pomoże komuś innemu.

Answer 2

O ile wiem, domyślnie jest to opaque. Przetestowałem zmianę wmode na transparent, opaque i usunąłem go. Gdy nie został określony, automatycznie ustawiono na opaque.

Nie jestem pewien, czy tak było zawsze, ale na pewno jest teraz.

Pamiętaj też, że dotyczy to tylko korzystania z odtwarzacza Flash. Możesz wyłączyć odtwarzacz HTML 5, aby przetestować to, co jest domyślne z 'Disable Youtube™ HTML5 Player' plugin. Następnie po prostu sprawdź element i drąż w dół, aż znajdziesz tag EMBED.