Na co si dát pozor u knihovny PIE?

Pondělí, Září 12, 2011
Logo PIE

Logo PIE

Knihovna PIE je šikovný pomocník pro každého kodéra. Umožňuje běžně používat CSS3 příkazy pro zakulacení rohů, lineární přechody a stín pod blokovými elementy i v internet exploreru. Díky tomu nám všem ulehčuje práci.

Při používání knihovny je však potřeba dodržovat několik zásad aby vše fungovalo. Adresa k souboru PIE.htc by měla být absolutní. Já běžně umisťuji tento soubor do kořenového adresáře webu a používám zápis:

behavior: url(/PIE.htc);

Je samozřejmě jedno, kde přesně bude soubor umístěn. Pokud se na něj však odkážete relativně, nemusí vše fungovat tak jak má. Přiznám se, že nevím přesně proč tomu tak je. Domnívám se ale, že při relativním zápisu je adresa souboru vzata vůči aktuálně zobrazené stránce a ne vůči souboru se stylopisem jak by se dalo očekávat. Při použití Cool URL, které se dnes běžně používá je to značně omezující. Absolutní zápis adresy to ale vše vyřeší.

Druhým problémem, na který jsem narazil je, že knihovna funguje ale „je nějaká pokažená“. Například jsem nadefinoval přechod na pozadí a najednou se dívám, že blok, který měl pozadí obsahovat celý zmizel. Později jsem přišel na to, že elementy, na kterých chcete tyto efekty použít je nutné napozicovat. Teď Vás jistě napadá nebude něco absolutně pozicovat jen proto, abych mohl mít gradient na pozadí. Finta je v tom, že pozicování nemusí být absolutní, ale může být klidně i relativní. V konečném důsledku stačí do stylopisu připsat jediný řádek:

position:relative;

A najednou vše funguje jak má.

Knihovnu PIE jsem si zvykl běžně používat, protože značně ulehčuje práci při kódování. Například při vytváření lineárního přechodu to není ani tak markantní ale ušetřený čas se výrazně projeví na kulatých rozích nebo na stínech pod elementy, kde bylo vždy třeba obalit elementy několika divy s patřičnými obrázky na pozadí, které neměli žádný další účel. Kromě toho se také ušetří nějaké pár http spojení pro přenos obrázků, které by jinak tyto efekty simulovaly.

Napsat komentář