Про фильтры в Internet Explorer

Надо отметить, что фильтры отображаются только в браузерах Internet Explorer не ниже 4-ой версии.

Синтаксис:

"filter:имя_фильтра(параметр1=значение, параметр2=значение,...)"

Некоторые фильтры могут быть без параметров.

Фильтры деляться на статические и динамические. Статические фильтры меняют вид объекта, а сам он остается неподвижным. Динамические фильтры позволяют менять объект с задаваемой скоростью переключения кадров.
Далее будут мною описаны 18 статических и 19 динамических фильтра.

Фильтры применяют через параметр STYLE:
Возьмём картинку (img.gif) и применим к ней фильтр прозрачности:
<IMG SRC=img.gif STYLE="filter:alpha(opacity=50)"> - имеем ту же картинку, но полупрозрачную.

Фильтры поддерживаются языками сценариев. Доступ к фильтрам организуется через объектное свойство filters и атрибут ID графического элемента.
JavaScript:
<script language="JavaScript">
function Blur(inc){
Pic.filters.blur.strength+=inc;}
</script>
...
<IMG ID=Pic SRC=img.gif
STYLE="filter:blur(strength=10)"
OnMouseOver="javascript:Blur(20)"
OnMouseOut="javascript:Blur(-20)">

Здесь функция Blur() обращается к фильтру blur объекта Pic и изменяет его параметр strength при наведении курсора мышки.

VBScript:
<script language="VBScript"> Pic.style.filter = "flipv" </script> ... <IMG ID=Pic SRC=img.gif>

Здесь используется фильтр flip, который переворачивает изображение вокруг вертикальной оси.

Статические фильтры

Alpha

Задает уровень прозрачности элемента страницы.

При настройке этого фильтра можно использовать следующие параметры:

Opacity

- Задает уровень прозрачности для элемента. Значение прозрачности может быть в пределах от 0 (полная прозрачность) до 100 (полностью непрозрачен).

Style

- Задает вид градиентной прозрачности: 0 (по умолчанию)-нет градиента, 1-линейный градиент, 2-круговой градиент, 3-прямоугольный градиент

StartX

- Горизонтальная координата, с которой начинается область градиентной прозрачности. Задается в пикселях.

StartY

- Вертикальная координата, с которой начинается область градиентной прозрачности. Задается в пикселях.

FinishX

- Горизонтальная координата, в которой заканчивается область градиентной прозрачности. Задается в пикселях.

FinishY

- Вертикальная координата, в которой заканчивается область градиентной прозрачности. Задается в пикселях.

Enabled

- Разрешение применения фильтра. Имеет два значения:
true (по умолчанию) - разрешает применить фильтр
false - не разрешает

AlphaImageLoaded

Отображает графическое изображение внутри элемента страницы между его фоном и содержимым.

При настройке этого фильтра можно использовать следующие параметры:

src

- URL-адрес файла с изображением.

SizingMethod

- Способ размещения изображения в пределах элемента страницы.

SezingMethod="crop" - обрезание изображения

SezingMethod="image"(по умолч.) - уменьшение или увеличение самого элемента страницы

SezingMethod="scale" - уменьшение или увеличение изображения

Enabled

BasicImage

Делает элемент страницы черно-белым, как бы просвеченным рентгеновскими лучами, вращает его.

Отдельно можно задавать угол поворота, стерень "просвеченности".

При настройке этого фильтра можно использовать следующие параметры:

GrayScale=1

- Элемент страницы отображается черно-белым

GrayScale=0 (по умолчанию)

- Цветным

Invert=1

- Элемент страницы отображается с инвертированными цветами

Invert=0 (по умолчанию)

- Элемент страницы отображается как обычно

MaskColor

- Цвет, на который будет заменен прозрачный цвет элемент страницы

Masc=1

- Прозрачный цвет элемента страницы будет заменен значением свойства MaskColor

Masc=0 (по умолчанию)

- Не будет

Mirror=1

- Элемент страницы будет отображен зеркально

Mirror=0 (по умолчанию)

- Элемент страницы будет отображен как обычно

Opacity

- Уровень прозрачности элемента страницы. Варьируется в пределах от 0.0 до 1.0

Rotation

- Задает поворот элемента страницы. Доступны всего 4-е занчения: 0 (по умолчанию) - нет поворота, 1 - на 90 градусов, 2 - на 180 градусов и 3 - на 270 градусов

XRay=1

- Элемент страницы будет "просвечен рентгеновскими лучами"

XRay=0 (по умолчанию)

- Как обычно

Enabled

Blur

Делает элемент страницы размытым.

При настройке этого фильтра можно использовать следующие параметры:

MakeShadow=true

- Элемент страницы будет отображаться как тень

MakeShadow=false (по умолчанию)

- Элемент страницы будет отображаться как обычно

PixelRadius

- Задает размер области размытия. Может принимать значения от 0.0 до 100.0

ShadowOpacity

- Указывает прозрачность тени. Может принимать заначения от 0.0 (что соответствует полной прозрачности) до 1.0 (полная непрозрачность)

Enabled

Chroma

Делает прозрачным отдельный цвет элемента.

При настройке этого фильтра можно использовать следующие параметры:

Color

- Задает цвет, который будет прозрачным

Enabled

Compositor

Объеденяет два цвета элемента страницы и выводит что получилось.

При настройке этого фильтра можно использовать следующие параметры:

Function

- Функция преобразования

Enabled

DropShadow

Отбрасывает тень у элемента страницы, которая отображается отдельно от самого элемента.

При настройке этого фильтра можно использовать следующие параметры:

Color

- Цвет

OffX

- Горизонтальное смещение тени

OffY

- Вертикальное смещение тени

Positive=true (по умолчанию)

- Тень создается из прозрачных пикселов элемента страницы

Positive=false

- Тень создается из непрозрачных пикселов элемента страницы ("негативная" тень)

Enabled

Emboss

Делает элемент страницы выпуклым.

При настройке этого фильтра можно использовать следующие параметры:

Bias

- Процентное значение, добавляемое к цвету элемента

Enabled

Engrave

Делает элемент страницы вдавленным.

При настройке этого фильтра можно использовать следующие параметры:

Bias

- Процентное значение, добавляемое к цвету элемента

Enabled

Glow

Создает эффект "тления" элемента страницы.

При настройке этого фильтра можно использовать следующие параметры:

Color

- Цвет

Strength

- Расстояние в пикселях, на которое выполняется "тление"

Enabled

Gradient

Эффект градиентной закраски элемента страницы.

При настройке этого фильтра можно использовать следующие параметры:

StartColor,StartColorStr

- Начальный цвет градиентной закраски

EndColor,EndColorStr

- Конечный цвет градиентной закраски

GradientType=1 (по умолчанию)

- Градиентная закраска распологается по горизонтали

GradientType=0

- Градиентная закраска распологается по вертикали

Enabled

Light

Создет эффект освещенности элемента страницы.

Методы, применяемые к этому фильтру:

AddAmbient({Красный},{Зеленый},{Синий},{Интенсивность})

- Добавляет источник рассеянного света с заданными цветовыми параметрами

AddCone({x1},{y1},{z1},{x2},{y2},{Красный},{Зеленый},{Синий},{Интенсивность},{Угол})

- Добавляет источник направленного света с заданными цветовыми параметрами. Параметры x1,y1,z1 задают координаты источника света, x2,y2 - точки, куда падает свет.

AddPoint({x},{y},{z},{Красный},{Зеленый},{Синий},{Интенсивность})

- Добавляет источник направленного света с заданными цветовыми параметрами. Координаты x,y,z - координаты источника света.

ChangeColor({№},{Красный},{Зеленый},{Синий},1|0)

- Изменяет цвет источника света с заданным номером на указанный цвет. Последний параметр указывает, будет абсолютное (1) или относительное (0) изменение цвета.

ChangeStrength({№},{Интенсивность},1|0)

- Изменяет интенсивность света источника с заданным номером. Последний параметр указывает, будет абсолютное (1) или относительное (0) изменение интенсивности.

Clear()

- Удаляет все источники света

MoveLight({№},{x},{y},{z},1|0)

- Перемещает источник света с заданным номером в место с заданными координатами. Последний параметр указывает, будет абсолютное (1) или относительное (0) перемещение.

Enabled

MaskFilter

Отображает прозрачный цвет элемента страницы заданным цветом.

При настройке этого фильтра можно использовать следующие параметры:

Color

- Задает цвет, которым замениться прозрачный цвет элемента страницы.

Enabled

Matrix

Изменяет элемент страницы путем изменения размеров, поворотов или инвертируя его при помощи матричных преобразований.

При настройке этого фильтра можно использовать следующие параметры:

- Значения fDx матричных преобразований

- Значения fDy матричных преобразований

FilterType

- Задает тип пикселов нового содержимого.
"bilinear" (по умолчанию)
"nearest neighbor"

M11,M12,M21,M22

- Значения fM11,fM12,fM21,fM22 матричных преобразований

SizingMethod

- Определяет способ размещения нового изображения в пределах элемента страницы, к которому применяется фильтр. Это свойство может иметь два значения:
"clip to original" (по умолчанию) - обрезание изображения
"auto expand" - уменьшение или увеличение изображения

Enabled

MotiobBlur

Создает эффект быстрого движения (размытости).

При настройке этого фильтра можно использовать следующие параметры:

Add

- Имеет 2 значения:
true - исходный элемент страницы перекрывает результат работы фильтра
false (по умолчанию) - результат работы фильтра перекрывает исходный элемент страницы

Direction

- Задает направление работы фильтра в градусах, которые должны быть кратны 45.

Strength

- Дистанция, задаваемая в пикселях, на которую выполняется работа фильтра

Enabled

Pixelate

Отображает элемент страницы отдельными пикселами.

При настройке этого фильтра можно использовать следующие параметры:

MaxSquare

- Этот параметр задает максимальный размер пикселов

Enabled

Shadow

Создает эффект отбрасывания тени у элемента страницы.

При настройке этого фильтра можно использовать следующие параметры:

Color

- Цвет тени

Direction

- Задает направление тени в градусах, которые должны быть кратны 45

Enabled

Wave

Создает волнистое искажение элемента страницы.

При настройке этого фильтра можно использовать следующие параметры:

Add

- Доступны два параметра:
true - элемент страницы, к которому был применени фильтр закроет результат фильтрации
false (по умолчанию) - результат фильтрации перекроет исходный элемент страницы

Freq

- Задает количество волн

LightStrength

- Окраска волн. Может принимать значение от 0 до 100

Phase

- Фаза волн. Может принимать значение от 0 до 100

Strength

- Дистанция, указанная в пикселах, на которую органицуется фильтрация

Enabled

Динамические фильтры

Barn

Создает эффект "открывающейся и закрывающейся двери".

При настройке этого фильтра можно использовать следующие параметры:

Motion

- Этот параметр может иметь 2 значения:
"out" (по умолчанию) - движение происходит из центра к границам
"in" - движение происходит от границ к центру

Orientation

- Если имеет значение "horizontal", то преобразование происходит по горизонтали
Если "vertical" - то по вертикали

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

- Задает процент выполнения преобразования. Может принимать значения от 0 (преобразование еще не началось) до 100 (преобразование закончено)

status

- Возвращает состояние выполнения преобразования:
0 - если преобразование было остановлено
1 - если оно было применено
2 - если преобразование выполняется

К фильтру можно применить следующие методы:

Apply()

- Замораживает элемент страниы, после чего вы можете делать с ним все, что хотите. Для того, чтобы запустить преобразование, используйте метод Play()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

BliendTrans

Плавно заменяет старое содержимое на новое.

При настройке этого фильтра можно использовать следующие параметры:

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Blinds

Создает эффект "открывающихся и закрывающихся жалюзи".

При настройке этого фильтра можно использовать следующие параметры:

Bands

- Этот параметр задает количество полосок

Direction

- Задает направление. Может принимать четыре значения:
"up","down","right","left"

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

CheckerBoard

Создает эффект шахматной доски.

При настройке этого фильтра можно использовать следующие параметры:

Direction

- Задает направление. Может принимать четыре значения:
"up","down","right","left"

SquaresX

- Задает количество рядов по горизонтали

SquaresY

- Задает количество рядов по вертикали

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Fade

Создает эффект наплыва, т.е. старое содержимое элемента странцы плавно пропадает, а новое одновременно плавно появляется.

При настройке этого фильтра можно использовать следующие параметры:

Overlap

- Этот параметр задает время относительно общей продолжительности работы фильтра, когда и страрое и новое содержимое элемента страницы отображаются одновременно.
Может принимать значения от 0.0 до 1.0

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

GradientWipe

Этот фильтр создает наползание нового содержимого элемента страницы на старое, причем граница выглядит как градиентная полоса.

При настройке этого фильтра можно использовать следующие параметры:

Gradientsize

- Задает часть площади элемента страницы, которая будет покрыта градиентной полосой.
Может принимать значения от 0.0 до 1.0

Motion

- Имеет два значения:
"forward" (по умолчанию) - движение происходит согласно значению свойства WipeStyle
"reverse" - в обратном порядке

WipeStyle

- Имеет 2 значения:
0 (по умолчанию) - движение происходит по горизонтали
1 - движение происходит по вертикали

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Inset

Новое содержимое страницы диагонально наползает на старое.

При настройке этого фильтра можно использовать следующие параметры:

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Iris

Этот фильтр создает эффект ирисовой диаграммы.

При настройке этого фильтра можно использовать следующие параметры:

IrisStyle

- Задает форму лепестков ирисовой диаграммы

Motion

- Имеет два значения:
"out" (по умолчанию) - движение происходит из центра к границам
"in" - движение происходит от границ к центру

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Pixelate

Старое содержимое элемента страницы рассыпается на отдельные пикселы, а новое содержимое собирается из отдельных пикселов.

При настройке этого фильтра можно использовать следующие параметры:

MaxSquare

- Задает максимальный размер пикселя

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

RadialWipe

Создает радиальное напользание нового содержимого элемента страницы на старое.

При настройке этого фильтра можно использовать следующие параметры:

WipeStyle

- Устанавливает способ замещения содержимого элемента страницы. Может иметь три значения:
"CLOCK" (по умолчанию) - вращение вокруг центра элемента страницы по часовой стрелке
"WEDGE" - вращение сразу в обе стороны
"RADIAL" - радиальное вращение

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

RandomBars

Старое содержимое элемента страницы рассыпается на отдельные линии, а новое содержимое собирается из отдельных линий.

При настройке этого фильтра можно использовать следующие параметры:

Orientation

- Задает направление преобразования. Может иметь два значения:
"horizontal" - преобразование происходит по горизонтали
"vertical" - преобразование происходит по вертикали

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

RandomDissolve

Создает эффект поточечного появления нового содержимого на месте старого.

При настройке этого фильтра можно использовать следующие параметры:

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

RevealTrans

Этот фильтр плавно заменяет старое содержимое элемента страницы на новое.

При настройке этого фильтра можно использовать следующие параметры:

Transition

- Эффект преобразования.

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Slide

Старое содержимое элемента страницы сдвигается в сторону, открывая под собой новое содержимое.

При настройке этого фильтра можно использовать следующие параметры:

SlideStyle

- Задает способ замещения содержимого элемента страницы. Может принимать три значения:
"HIDE" (по умолчанию) - скрытие
"PUSH" - выталкивание
"SWAP" - замена

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Spiral

Старое содержимое элемента страницы спирально закрашивается новым содержимым.

При настройке этого фильтра можно использовать следующие параметры:

GridSizeX

- Задает количество полосок по горизонтали. Принимает значения от 1 до 100

GridSizeY

- Задает количество полосок по вертикали. Принимает значения от 1 до 100

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Stretch

Этот фильтр растягивает новое содержимое элемента страницы, тем самым закрывая старое содержимое.

При настройке этого фильтра можно использовать следующие параметры:

StretchStyle

- Задает способ замещения содержимого элемента страницы. Доступны три значения:
"HIDE" - скрытие
"PUSH" - выталкивание
"SPIN" (по умолчанию) - замена

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Strips

Новое содержимое элемента страницы диагонально отдельными полосками наползает на старое содержимое.

При настройке этого фильтра можно использовать следующие параметры:

Motion

- Задает угол, из которого появляется новое содержимое. Имеет четыре значения:
"leftdown","leftup","rightdown","rightup"

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Wheel

Создает эффект посекторного наползания нового элемента страницы на старый.

При настройке этого фильтра можно использовать следующие параметры:

Spokes

- Задает количество секторов. Может принимать значение от 2 до 20

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование

Zigzag

Новое содержимое элемента страницы зигзагообразно отдельными полосками наползает на старое.

При настройке этого фильтра можно использовать следующие параметры:

GridSizeX

- Задает количество полосок по горизонтали. Принимает значения от 1 до 100

GridSizeY

- Задает количество полосок по вертикали. Принимает значения от 1 до 100

Enabled

Duration

- Продолжительность преобразования в секундах

Percent

status

К фильтру можно применить следующие методы:

Apply()

Play([Продолжительность])

- Запускает преобразование

Stop()

- Немедленно останавливает преобразование