Nové filtry dle Microsoftu 1.

Většina z vás si pravděpodobně ještě vybaví několik mých předešlých článků, v nichž jsem se věnoval zobrazovacím filtrům pro CSS. Dnes bych vás rád seznámil s několika dalšími filtry, které však použijete výhradně v MSIE. Není pravděpodobné, že by se tyto filtry dostaly do CSS3, nicméně jejich znalost se může v některých speciálních případech hodit.

Jak jsem řekl, o statických filtrech v CSS dle definice Microsoftu jste se na Intervalu mohli dočíst nedávno, proto se již nebudu vracet k informacím obecným, ale podrobněji se zaměřím na první čtyři filtry použitelné pouze s novou syntaxí. Konkrétně tedy na filtry BasicImage, Compositor, Emboss a Engrave. Znovu upozorňuji, že tyto filtry jsou podporovány pouze v prohlížečích MSIE 5.5 a vyšší!

Filtr BasicImage

Filtr BasicImage upravuje barevné zobrazení, otočení dle vertikální nebo horizontální osy nebo průhlednost prvku. Nahrazuje filtry FlipH, FlipV, Gray, Invert a Xray, použitelné pouze se starou syntaxí Microsoftu.

Syntaxe: <ELEMENT STYLE="filter:progid:DXImageTransform.Microsoft.BasicImage(enabled=boolean, grayscale=boolean, invert=boolean, mask=boolean, maskcolor=integer, mirror=boolean, opacity=floating-point, rotation=integer, xray=boolean);">

Pro lepší pochopení tohoto filtru si můžete vyzkoušet jeho vlastnosti na testovací stránce připravené Microsoftem.

Filtr Compositor

Tento filtr zobrazí nový prvek se změněnou průhledností určitých oblastí prvku původního. Je specifický tím, že se chová jako přechod, ale vrací pouze statický obsah.

Syntaxe: <ELEMENT STYLE="filter:progid:DXImageTransform.Microsoft.Compositor(function=integer);">

Význam hodnot parametru Function filtru Compositor:

• 0 – Neprovede nic, prvek se nezobrazí.
• 1 – Zobrazí minimum barev obou prvků.
• 2 – Zobrazí maximum barev obou prvků.
• 3 – Zobrazí pouze prvek A.
• 4 – Zobrazí prvek A nad prvkem B.
• 5 – Zobrazí všechny části prvku A, které jsou s prvkem B společné.
• 6 – Zobrazí všechny části prvku A, které nejsou společné s prvkem B.
• 7 – Zobrazí prvek A nad prvkem B, přičemž prvek A je viditelný pouze na společných částech.
• 8 – Zobrazí prvek A, přičemž na společných částech odebere také vzorek hodnot barev prvku B.
• 9 – Zobrazí prvek A, přičemž na společných částech přidá také vzorek hodnot barev prvku B.
• 10 – Zobrazí prvky A a B, bez společných ploch.
• 19 – Zobrazí pouze prvek B.
• 20 – Zobrazí prvek B nad prvkem A.
• 21 – Zobrazí všechny části prvku B, které jsou s prvkem A společné.
• 22 – Zobrazí všechny části prvku B, které nejsou společné s prvkem A.
• 23 – Zobrazí prvek B nad prvkem A, přičemž prvek B je viditelný pouze na společných částech.
• 24 – Zobrazí prvek B, přičemž na společných částech odebere také vzorek hodnot barev prvku A.
• 25 – Zobrazí prvek B, přičemž na společných částech přidá také vzorek hodnot barev prvku A.

Ačkoli má tento filtr pouze jeden parametr, jeho nastavení je velice variabilní, nejlépe si vše vyzkoušíte na příkladě, který uvádí na svých stránkách Microsoft.

Filtr Emboss

Filtr Emboss vyryje světlé části prvku do černobílého podkladu.

Syntaxe: <ELEMENT STYLE="filter:progid:DXImageTransform.Microsoft.Emboss(bias=floating-point, enabled=boolean);">

Příklad:

Zdrojový kód ukázky je <img src="embossengrave.gif" width="190" height="60" alt="Obrázek s použitím filtru Emboss" style="filter:progid:DXImageTransform.Microsoft.Emboss();" />.

Filtr Engrave

Filtr Engrave funguje velice podobně jako filtr Emboss. Rozdíl je pouze v tom, že Engrave vyryje tmavé části prvku do černobílého podkladu.

Syntaxe: <ELEMENT STYLE="filter:progid:DXImageTransform.Microsoft.Engrave(bias=floating-point, enabled=boolean);">

Příklad:

Zdrojový kód ukázky je <img src="embossengrave.gif" width="190" height="60" alt="Obrázek s použitím filtru Engrave" style="filter:progid:DXImageTransform.Microsoft.Engrave();" />.