Flashové YouTube video, z-index a wmode

Pokud na stránku vložíte YouTube video přes iframe, což může být flashový přehrávač, a nějaký prvek (třeba div), kterým chcete daný flash překrýt (absolutní pozicování, z-index třeba 102), můžete mít problém. V různých prohlížečích se to chová různě.

Firefox může flashové video bez problému překrýt, Opera také, ale třeba průhledné části divu překreslí černě. O jednotlivých verzích Internet Exploreru ani nemluvě. A třeba Chrome může flashem překrýt celý div, i když to mělo být naopak.

Nastavit CSS vlastnost z-index obyčejně nepomůže. Naštěstí lze problém jednoduše vyřešit pomocí atributu wmode.

Flashové YouTube video a wmode

Takhle nějak vypadá iframový kód YouTube videa vkládaný do stránky:

<iframe title="YouTube video player" width="560" height="349"
src="http://www.youtube.com/embed/aAWpkZSCMXU"
frameborder="0" allowfullscreen></iframe>

Stačí elegantně přidat parametr wmode=opaque k url adrese, tj. do src atributu:

src="http://www.youtube.com/embed/aAWpkZSCMXU?wmode=opaque"

Podrobnosti o wmode přímo u Adobe.

 




5 Responses to “Flashové YouTube video, z-index a wmode”

  • Čenda Says:

    Ahoj, vím, že komentuji starší post, ale měl bych jednu otázku. Wmode funguje opravdu parádně, ale potřeboval bych do src ještě vtěsnat rel=0, aby se nezobrazovaly náhledy dalších videí po skončení toho mého videa, ale funguje buď jedno, nebo druhé. Netušíš, co s tím?

    Díky

    Čenda

  • Zdeněk Veřeřa Says:

    Čendo, normální zřetězení parametrů nefunguje? Mělo by.

    src=”http://www.youtube.com/embed/aAWpkZSCMXU?wmode=opaque&rel=0″

  • Čenda Says:

    Ahoj Zdeňku, moc děkuji za radu. Když jsem to napsal ve formátu: src=”http://www.youtube.com/embed/aAWpkZSCMXU?wmode=opaque&rel=0″, tak mi to u videa psalo “Uživatel video odstranil”, tak mě napadlo to zřetězení prohodit do src=”http://www.youtube.com/embed/sXn_Co0H0J8?rel=0&wmode=opaque” a to už funguje.

    Opravdu moc děkuji za ochotu a radu nad zlato :-)

    S pozdravem

    Čenda

  • Čenda Says:

    Už vím proč mi to psalo, že uživatel video odstranil :-) Prvně jsem totiž zkopíroval Tvůj link, co jsi psal a nedošlo mi, že to je na jiné video na Youtube :-) Tudíž to zřetězení funguje i v opačném pořadí :-)

    S pozdravem

    Čenda

  • Manwe Says:

    Dik, pomohlo :)

Leave a Reply