Фильтр RevealTrans | назначение, параметры фильтра, примеры

Фильтр RevealTrans Фильтр RevealTrans указывает, какой из возможных стандартных переходов применить при...

Фильтр RevealTrans указывает, какой из возможных стандартных переходов применить при изменении контента элемента.

Для браузеров IE 5.5-7 фильтры можно подключать в CSS документ с помощью CSS свойства filter. В IE8+ для этого предусмотрено вендорное CSS свойство -ms-filter. Причем из-за особенностей синтаксического анализатора IE8 их порядок имеет значение: -ms-filter должен идти первым.

Синтаксис

div {
   -ms-filter:"progid:DXImageTransform.Microsoft.RevealTrans()";
   filter:progid:DXImageTransform.Microsoft.RevealTrans();

}

Параметры отделяются друг от друга запятой. Параметр состоит из двух частей: имени параметра и его значения, разделенных знаком равно. Значение параметра может быть взято в кавычки.

Параметры фильтра

Параметр Описание Возможные значения Значение по умолчанию
duration определяет время в секундах и миллисекундах, которое займет переход от старого значения к новому действительное число с точкой между целой и дробной частью и четырьмя знаками после точки нет
enabled флаг, управляющий фильтром
  • true — фильтр включен
  • false — фильтр отключен
true
transition определяет тип перехода
  • 0 — Box in (анимация сужения прямоугольника к центру)
  • 1 — Box out (анимация расширения прямоугольника от центра)
  • 2 — Circle in (анимация сужения круга к центру)
  • 3 — Circle out (анимация расширения круга от центра)
  • 4 — Wipe up (анимация перехода перемещением вверх)
  • 5 — Wipe down (анимация перехода перемещением вниз)
  • 6 — Wipe right (анимация перехода перемещением вправо)
  • 7 — Wipe left (анимация перехода перемещением влево)
  • 8 — Vertical blinds (анимация вертикальные жалюзи)
  • 9 — Horizontal blinds (анимация горизонтальные жалюзи)
  • 10 — Checkerboard across (анимация шахматной доски слева направо)
  • 11 — Checkerboard down (анимация шахматной доски сверху вниз)
  • 12 — Random dissolve (анимация перехода случайными пикселями)
  • 13 — Split vertical in (анимация перехода сходящейся вертикальной трещиной )
  • 14 — Split vertical out (анимация перехода расходящейся вертикальной трещиной )
  • 15 — Split horizontal in (анимация перехода сходящейся горизонтальной трещина )
  • 16 — Split horizontal out (анимация перехода расходящейся горизонтальной трещиной )
  • 17 — Strips left down (анимация перехода диагональной полосой, идущей с левого нижнего угла)
  • 18 — Strips left up (анимация перехода диагональной полосой, идущей с левого верхнего угла)
  • 19 — Strips right down (анимация перехода диагональной полосой, идущей с правого нижнего угла)
  • 20 — Strips right up (анимация перехода диагональной полосой, идущей с правого верхнего угла)
  • 21 — Random bars horizontal (анимация перехода случайными горизонтальными полосами )
  • 22 — Random bars vertical (анимация перехода случайными вертикальными полосами )
  • 23 — случайный переход из вышеперечисленных
нет

Также с помощью скриптов можно узнавать состояние перехода и останавливать переход в заданный момент времени.

Пример

Элемент к которому применен случайный переход длительностью 10.5 сек.

div {
   -ms-filter:"progid:DXImageTransform.Microsoft.RevealTrans(transition=23, duration=10.5)";
   filter:progid:DXImageTransform.Microsoft.RevealTrans(transition=23, duration=10.5);
}


Фильтр не управляет переходами между значениями, а только указывает, указывает, какой из возможных стандартных переходов применить, а также регулирует длительность перехода. Управлять самим изменением контента элемента можно только с помощью скриптов.

Показать комментарии

Смотрите также в этом разделе

Смежные материалы, которые могут быть вам полезны

  • Фильтр Alpha | назначение, параметры фильтра, примеры
  • Фильтр AlphaImageLoader | назначение, параметры фильтра, примеры
  • Фильтр BasicImage | назначение, параметры фильтра, примеры
  • Фильтр BlendTrans | назначение, параметры фильтра, примеры
  • Фильтр Blur | назначение, параметры фильтра, примеры
  • Фильтр Chroma | назначение, параметры фильтра, примеры
  • Фильтр Compositor | назначение, параметры фильтра, примеры
  • Фильтр DropShadow | назначение, параметры фильтра, примеры
  • Фильтр Emboss | назначение, параметры фильтра, примеры
  • Фильтр Engrave | назначение, параметры фильтра, примеры
  • Фильтр FlipH | назначение, параметры фильтра, примеры
  • Фильтр FlipV | назначение, параметры фильтра, примеры
  • Фильтр Glow | назначение, параметры фильтра, примеры
  • Фильтр Gradient | назначение, параметры фильтра, примеры
  • Фильтр Gray | назначение, параметры фильтра, примеры
  • Фильтр ICMFilter | назначение, параметры фильтра, примеры
  • Фильтр Invert | назначение, параметры фильтра, примеры
  • Фильтр Light | назначение, параметры фильтра, примеры
  • Фильтр MaskFilter | назначение, параметры фильтра, примеры
  • Фильтр Matrix | назначение, параметры фильтра, примеры
  • Фильтр MotionBlur | назначение, параметры фильтра, примеры
  • Фильтр Shadow | назначение, параметры фильтра, примеры
  • Фильтр Wave | назначение, параметры фильтра, примеры
  • Фильтр Xray | назначение, параметры фильтра, примеры