Průhlednost PNG a Internet Explorer 6

Způsobů řešení tohoto problému existuje několik. Jako nejjednodušší a nejefektivnější mi připadne doplnění jediného souboru s JavaScriptem, případně jeho vykopírování a vložení přímo do těla stránky. Obsahem tohoto skriptu je smyčka procházející všechny obrázky v těle stránky. Pokud najde PNG, pak aplikuje filtr AlphaImageLoader, který v Internet Exploreru 5.5 a 6 zajistí zprůhlednění odpovídající části obrázku PNG. 

Vzhledem k využití zmíněného filtru funguje tento postup pouze v Internet Exploreru 6 a 5.5. Starší verze prohlížeče filtr nepodporují, IE7 pak zvládá průhledné PNG i bez tohoto postupu. Připojený JavaScriptový soubor je nutné umístit mezi podmínkový komentář sledující, zda je použit Internet Explorer starší než verze 7. Tato podmínka se navíc v jiných prohlížečích nevyhodnocuje a je plně validní, nemusíte se tedy bát ji v kódu použít.

<!--[if lt IE 7.]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]--> 

Výraz defer ve značce script zajišťuje, aby obrázky byly upraveny ještě před tím, než budou na stránce vykresleny. Příslušný soubor pngfix.js a jeho varianty pro obrazové mapy a tzv. rollover obrázky si stáhněte ze stránky homepage.ntlworld.com/bobosola v sekci How To Use. Doporučuji si prohlédnout i příklady částečné průhlednosti PNG a rozdíl mezi PNG a GIFem.

Před pár dny se na Drupal.org objevil nový modul, který také zajišťuje správné zpracování průhlednosti v Internet Exploreru 5.5 a 6. Využívá výše zmíněný soubor pngfix.js. Modul stačí nainstalovat a aktivovat, žádné další nastavování není potřeba. Kouknete-li, jak je napsán, zjistíte, že obsahuje pouze funkci pro zobrazení nápovědy a zavěšení na výpis drupalovské hlavičky. Do ní pak přidá volání JavaScriptového souboru. Modul si můžete stáhnout z jeho projektové stránky na Drupal.org; jmenuje se PNG Fix.