веб-дизайн
dHTML фильтры
для ваших вопросов
marsel@emux.net

Фильтры, предназначенные для текста
   Изобретение DHTML-фильтров значительно продвинуло возможности HTML, т.к. функции таких фильтров не уступают java-скриптам, оставаясь"компактными", большинство фильтров работают с текстами и графическими изображениями, единственный недостаток - не все браузеры поодерживаю DHTML. Большинство нижеприведенных примеров смогут работать только в IE 4.x и выше.
Mask - Выделяет текст
   Фильтр Mask выделяет объект,как будто бы вы выделили его мышью.
   Синтаксис:STYLE="filter:Mask(Color=color)" color - цвет выделения(#ff0000)
   Пример:

<style type="text/css">
.MaskFilter{filter:Mask(Color=ff0000)}
</style>
<div class="MaskFilter" STYLE="width:360;height:30;font:bold 16pt;>
Среди всех я самая выделенная</div>
 Среди всех я самая выделенная

Shadow - Супер тень
   Фильтр Shadow делает объекту тень
Синтаксис:
filter:Shadow(Color=color, Direction=direction) color - цвет тени.
Direction - (от 0 до 315)направление тени.
<style>
.pr2{filter:Shadow(Color="#000000", Direction="150")}
</style>
<div class="pr2"
style="width:200;height:30;font:16pt;color:red;">Я самая
теневая</div>

Я самая теневая


Фильтр FlipH
   Фильтр FlipH переворачивает объект горизонтально.
Синтаксис: STYLE="filter:FlipH" Пример:
<style type="text/css">
.pr3{filter:FlipH;}
</style>
<div class="pr3"
style="width:200;height:30;font:16pt;color:red;">Я самая
перевернутая</div>
Я самаяперевернутая

Фильтр FlipV
   Фильтр FlipV переворачивает объект вертикально.

Фильтр Glow
   Фильтр FlipV переворачивает объект вертикально. С помощью фильтра Glow ваш обект засияет.
Синтаксис:
STYLE="filter:Glow(Strength=strength, Color=color;)" color - цвет которым засияет текст. strength - сила с которой он засияет(0-100)
Пример:
<style type="text/css"> .pr4{filter:Glow(Strength=3,
Color="#ff0000")} </style> <div class="pr4"
style="width:200;height:20;font:bold 16pt;color:gold"> Я самая
сияющая</div>
 Я самая сияющая

Фильтр Wave
   Фильтр Wave делает объект волнистым.
Синтаксис: filter: Wave( Freq=freq, Add=add, LightStrength=strength, Phase=phase, Strength=strength) Freq - число волн Add - незнаю :( LightStrength - сила волны Phase - угол волны Strength - интенсивность волны Пример:
<style>
.pr5{filter:Wave(Freq=5, Add=0, LightStrength=1, Phase=2, Strength=2)}
</style>
<div class="pr5"
style="width:400;height:30;font:26pt;color:red;">Я самая
волнистая</div>
Вот что получилось:
Я самая волнистая

Фильтр DropShadow
   Фильтр DropShadow делает тень к тексту.
Синтаксис: STYLE="filter:DropShadow(Color=color, OffX=Offx, OffY=Offx, Positive=positive)" Color - Цвет тени(#ff0000) OffX - Смещение тени по X OffY - Смещение тени по Y Positive - Значение или 0, или 1. Пример:
Я самая оттенистая

Фильтры, применяемые с графикой
   Возьмем любую картинку и теперь применим к нему фильтры:Любая картинка
Фильтр Alpha
   Фильтр Alpha осветляет объект.
Синтаксис: STYLE="filter:Alpha(Opacity=opacity, FinishOpacity=finishopacity, Style=style, StartX=X, StartY=Y, FinishX=X, FinishY=Y)"
Opacity - степень осветления(0-100. 0 светло, 100 темно). FinishOpacity - конечная степень осветления(0-100. 0 светло, 100 темно). Style - Число 0(???), 1(линия) 2(круг) 3(прямоугольник)
Пример:
<style>
.gr{filter:Alpha(Opacity="90",FinishOpacity="45",Style="3")}
</style>
<img class="gr1" src="a2.gif">
Что у нас получилось: Фильтр Alpha

Фильтр Blur
   Фильтр Blur размывает рисунок в определенную сторону.
Синтаксис: STYLE="filter:Blur(Add = add, Direction = direction, Strength = strength)" Add - Или 0, или 1. Direction - От 0 до 315 - в какую сторону произойдет размытие. Strength - Смещение
Пример:
<style>
<.gr2{filter:Blur(Add="1",Direction="310",Strength="10")}
</style>
<img class="gr2" src="a2.gif">
Что получилось: Фильтр Blur

Фильтр Invert
   Такой фильтр позволит вам инвертировать (сделать негатив) цвета вашем рисунке
Синтаксис: STYLE="filter:Invert"
Пример:
<style>
.gr3{filter:Invert}
</style>
<img class="gr3" src="a2.gif">
Что получилось: Фильтр Blur

Фильтр Gray
   Фильтр Gray делает рисунок черно-белым
Синтаксис: STYLE="filter:Gray"
Пример:
<style>
.gr4{filter:Gray}
</style>
<img class="gr4" src="a2.gif">
Что получилось: Фильтр Blur

Фильтр Chroma
   Фильтр Chroma определенный цвет прозрачным.
Синтаксис: STYLE="filter:Chroma(Color = color)" Color - цвет(#ff0000)
Пример:
<style>
.gr5{filter:Chroma(Color ="#d1914e")}
</style>
<img class="gr5" src="a2.gif">
Что получилось: Фильтр Blur

Фильтр Xray
   Фильтр Xray делает картинку в серызх тонах, плюс штрихование.
Синтаксис: STYLE="filter:Xray"
Пример:
<style>
.gr6{filter:Xray}
</style>
<img class="gr6" src="a2.gif">
Что получилось: Фильтр Blur


  Главная страница | Предыдущий раздел | На верх страницы | Следующий раздел