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);">

Parametr Popis
Enabled Určuje možnost použití filtru. Může nabývat hodnot true (zapnutý) nebo false (vypnutý).
GrayScale Určuje černobílé zobrazení prvku. Nahrazuje filtr Gray. Může nabývat hodnot 1 (zapnutý) nebo 0 (vypnutý).
Invert Určuje zobrazení prvku jako barevného negativu. Nahrazuje filtr Invert. Může nabývat hodnot 1 (zapnutý) nebo 0 (vypnutý).
Mask Nastaví, zda mají být transparenní plochy zobrazeny v barvě určené parametrem MaskColor. Může nabývat hodnot 1 (zapnutý) nebo 0 (vypnutý).
MaskColor Nastaví barvu zobrazení transparentních ploch v prvku. Parametr má svou funkci pouze pokud je Mask nastaveno na 1 (zapnutý). Může nabývat hodnot 32bitového ARGB formátu, tedy 0x0000000 až 0xfffffff.
Mirror Určuje otočení prvku podle horizontální roviny. Nahrazuje filtr FlipH. Může nabývat hodnot 1 (zapnutý) nebo 0 (vypnutý).
Opacity Nastaví úroveň průhlednosti. Může nabývat hodnot 0 (úplně průhledný) až 1 (zcela neprůhledný).
Rotation Určuje otočení prvku podle vertikální roviny. Nahrazuje a rozšiřuje filtr FlipV. Může nabývat hodnoty 0 (normální zobrazení), 1 (otočení o 90 stupňů), 2 (otočení o 180 stupňů), 3 (otočení o 270 stupňů).
Xray Určuje zobrazení prvku jako rentgenového snímku. Nahrazuje filtr Xray. Může nabývat hodnot 1 (zapnutý) nebo 0 (vypnutý).

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);">

Parametr Popis
Function Nastaví funkci, kterou filtr s prvkem provede. Může nabývat hodnot 0 až 25.

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);">

Parametr Popis
Bias Nastaví procento přidaných hodnot barevných složek prvku. Může nabývat hodnot od -1,0 do 1,0; standardně nastaveno na 0,7.
Enabled Určuje možnost použití filtru. Může nabývat hodnot true (zapnutý) nebo false (vypnutý).

Příklad:

Obrázek s použitím filtru Emboss

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);">

Parametr Popis
Bias Nastaví procento přidaných hodnot barevných složek prvku. Může nabývat hodnot od -1,0 do 1,0; standardně nastaveno na 0,7.
Enabled Určuje možnost použití filtru. Může nabývat hodnot true (zapnutý) nebo false (vypnutý).

Příklad:

Obrázek s použitím filtru Engrave

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();" />.

Žádný příspěvek v diskuzi

Odpovědět