Jak mít validní FLASH (XHTML 1.0 Transitional)
Dlouhou dobu jsem měl problém na svých osobních stránkách, kde prezentuji a nabízím služby v oblasti tvorby webových stránek, s validací XHTML kódu pouze a jen kvůli kódu, který generuje Macromedia Flash. Je to z toho důvodu, že dané tagy nejsou podle specifikace XHTML 1.0 Transitional validní. Běžný výstup Macromedia Flash je následující:
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="fl.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="movie.swf" mce_src="movie.swf" quality="high" bgcolor="#ffffff" width="335" height="76" name="fl" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
Na vině je tag EMBED, který není validní podle specifikace XHTML (tedy ani XHTML 1.0 Transitional a XHTML 1.0 Strict). Na internetu jsem našel několik možností, kdy jedno z nich je originální v tom, že se osekal kód generovaný Flashem. Kód pak byl validní, ale nezobrazoval se ve Firefoxu a na linuxových prohlížečích (IE, Maxthon, Opera i Netscape bez problému načetli swf soubor).
Proto jsem hledal dál a našel další (stále ne však finální) řešení a to bylo použití javascriptu, který podle zadaných parametrů načetl flash a bez problému jej zobrazil.
První řešení vypadalo následovně.
V hlavičce mezi tagy head je třeba vložit toto (použitý javascript si můžete stáhnout → flashobject.js, 8 kB):
Na místě, kde se pak měl zobrazit flash, byl tento kód:
// <![CDATA[
var fo = new FlashObject("fl.swf", "fl", "335", "76", "8", "#FFFFFF");
fo.write("flashcontent");
// ]]>
</script>
Parametry v proměnné FlashObject jsou postupně zleva do prava: relativní cesta k souboru, název, šířka flashe, výška flashe, verze flashe a barva pozadí. Výsledek je pak již validní a funguje ve všech prohlížečích.
Toto řešení je sice elegantní, ale je nutné použít výše uvedený javascript. Proto jsem hledal dál a našel řešení, které vychází opět z toho, že se oseká a přepíše část kódu flashe. Výsledek vypadá takto:
<param name="movie" value="http://www.web-art.cz/fl.swf" />
<img src="flash.gif" mce_src="flash.gif" width="335" height="76" alt="flash" />
</object>
Jak vidíte, stačí nastavit cestu k souboru, šířku a výšku a můžete také pomocí tagu IMG nastavit alternativní obrázek v případě, že se flash přece jen nezobrazí, což může být pouze v případě, že v prohlížeči není nainstalovaný Flash Player. Výsledkem je validní kod XHTML 1.0 Transitional na stránkách www.web-art.cz.
Štítky: Programování
Komentáře
chvd
16. únor 2006, 00:31
Jestli se nepletu, tak při tom posledním uvedeném řešení některé browsery v případě, že nebude nainstalovaný flash plugin nezobrazí neflash alternativu, ale pozadí flashe nebo prostě černý obdélník. Navíc to řešení nikterak neošetřuje testování verze flashplayeru, takže se třeba flash zobrazí, ale bude nefunkční, tedy opět jen obdélník…
Jirka
16. únor 2006, 00:28
Ahoj, hele ten container pro cash zní zajímavě, jestli máš tohle řešení, tak mi ho prosím pošli na email a já to rád otestuji a zveřejním.
O tom problému v IE vím. Ale i za tu cenu je to pro mne lepší řešení, než to které jsem nastínil v úvodu článku, kdy se používá JavaScript… Takhle tam sice na chvíli je objekt, který se tváří jako neexistujicí objekt, ale co nadělám. Proto je tam aspoň ta možnost hodit tam, před tím než se načte flash, obrázek. Pokud někdo zjistí, jak to rozumně obejít, pište.
Btch
16. únor 2006, 00:24
jo tenhle zpusob je znamej, jeste se tam pridava container pro cash, je tu ale problem v zobrazeni pro IE…
IE to zobrazuje tak, ze nejdrive ukaze ikonku pro neexistujici objekt a pote teprve nahraje flash a to se mi nelibi a nemuzu to odstranit… mate k tomu radu?
