Miért látszik folyamatosan a YouTube videó?
Sok embernek okoz gondot, hogy egy beépített YouTube videó mindig az elemek fölé kerül. Így jártam jelen pillanatban én is.
Egy admin felületen vizuális panelszerkesztő felületet csinálok, ahol az oldal elemeit valós időben lehet szerkeszteni. YouTube panel, slideshow, szövegbox. Bármit hozzáadhat az admin… A panelekről információt kérhetünk le, egy kis “i” gombra kattintva, ami egy beúszó ablakban jön be.
Eleinte fel sem tűnt, hogy a YouTube videók megpróbálnak minden elem fölé kerülni. Egy darabig ez nem is zavart, csak mikor egy teljes szerkesztő felületen lett az inputok és gombok helyén YouTube video részlet. Először próbálkoztam azzal, ami ilyenkor elsőként eszembe jut, z-index az elemen. Jó pár 9-es után sem javult a helyzet, így ismét Gugliztam kicsit.
A megoldás nem is olyan bonyolult. Mivel a YouTube a beágyazó kódot elég rég átalakította iframere, így már régóta nem lehet flash változóban átadni, hogy a flash ne window módban fusson.
Vagyis első körben ez derült ki. Második körben pedig az, hogy mégis át lehet adni, csak simán a beágyazott videó linkje mögé kell beilleszteni a:
&wmode=opaquevagy más felhasználók szerint a
?wmode=transparentparamétert.
A kettő között jelenleg annyi különbség derült ki, hogy a wmode=opaque bárhová kerülhet, működik, míg a wmode=transparent csak az első paraméterként működik.
Példa:
Ha az opaque verziót használjuk:
<iframe width="420" height="315" src="//www.youtube.com/embed/cq4PZPWD_0Y?rel=0&wmode=opaque" frameborder="0" allowfullscreen></iframe>vagy
<iframe width="420" height="315" src="//www.youtube.com/embed/cq4PZPWD_0Y?wmode=opaque&rel=0" frameborder="0" allowfullscreen></iframe>Ha a transparent verziót használjuk:
<iframe width="420" height="315" src="//www.youtube.com/embed/cq4PZPWD_0Y?wmode=transparent&rel=0" frameborder="0" allowfullscreen></iframe>Tehát semmi extra nem kell, csak a megfelelő helyre kell illeszteni a paramétert. Én az első verziót használom.