Průhledné PNG v IE6 – Jednodušší už to nebude nikdy!
(Žádná hodnocení)
O této problematice jsem již napsal 2 články (první, druhý). Probrali jsme old school metodu založenou na přímém volání AlphaImageLoaderu, a pak jsme se dostali k modernějším metodám. Zmiňoval jsem nejprve jQuery.pngFix, který se následně přejmenoval a vylepšil na můj oblíbený jQuery.ifixpng.
Implementace skriptu jQuery.ifixpng vyžaduje 5 strojově nezáživných kroků a téměř nikdy mi to na stránkách nefungovalo na první pokus. Vždy jsem někde udělal chybu. Já vám dnes ukážu metodu, která vyžaduje pouze 1 krok + 1 důležitou podmínku! Celá věc se jmenuje IE7.js! Jak na to?
- Do hlavičky stránek umístíme následující kód
<!--[if lt IE 7]> <script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script> <![endif]-->
- Všechny png obrázky, na které budeme chtít skript použít se musí jmenovat jméno_souboru-trans.png!
- To je vše!
Použili jsme známý trik zvaný conditional comments. Ostatní prohlížeče kód ignorují, zatímco internet explorery ho vidí jako podmíněné výrazy. V našem případě &lt;!–[if lt IE 7]&gt; znamená If lower than Internet Explorer 7 (Pokud nižší verze IE než 7), pak se vloží náš javascript IE7.js.
Ještě připomenu, že stejně jako u všech známých metod na průhledné png v IE6, to nefunguje na opakující se pozadí a nelze aplikovat vlastnost background-position v CSS.
Průhledné png je ale jen jedna věc, kterou skript IE7.js řeší. Celý projekt má mnohem vyšší ambice, a to učinit IE6 kompatibilní s IE7. Nevím, do jaké míry se jim to podařilo, příliš detailně jsem to netestoval. Všiml jsem si ale, že v IE6 začaly fungovat pokročilejší CSS selektory typu input[type=submit], takže zřejmě budou fungovat i další!
Existuje také skript IE8.js, který už je o něco dál a snaží se z IE7 učinit IE8. Více na domovské stránce projektu.
Vyvěsit odkaz - networking
Líbil se ti tento článek? Ukaž ho i ostatním! Pro snadné přidání odkazu na Facebook, Linkuj.cz nebo Twitter klikni na jednu z ikonek výše a nech další, ať si článek také přečtou.
Přečtěte si také
- Jak na průhledné png v Internet Exploreru 6 – pomocí jQuery.ifixpng (Chates, Tvorba webu)
- Jak na průhledné PNG v Internet Exploreru 6 a 5.5? (Chates, Tvorba webu)
- Jak spočítat sílu CSS selektoru? (Chates, Tvorba webu)
- TxEff – Úžasné textové efekty v Adobe Flash CS3 (Chates, Offtopic)
- Jak nainstalovat na debianu bundled verzi PHP GD? (Longer, Linux)
- Opera – jak se zbavit automatického spouštění Flash videí? (DXP, Internet)
Zanechat odpověď