Архив категории ‘Основы CSS’

Фильтр revealTrans

    На этом шаге мы рассмотрим фильтр revealTrans.     Фильтр revealTrans позволяет, в отличие от перехода blendTrans, выполнить переходы из одного видимого состояния в другое разнообразными способами. Его свойство Transition может иметь целое значение, которое определяет тип перехода. Допустимые значения представлены в таблице 1. Таблица 1. Значения свойства Transition Переход Отображение объекта 0 Сжимающийся прямоугольник […]

Фильтр blendTrans

    На этом шаге мы рассмотрим переход blendTrans.     Фильтр blendTrans задает постепенное исчезновение или появление изображения, увеличивая или уменьшая степень его прозрачности. Следующий пример демонстрирует постепенное исчезновение одной картинки и появления другой. <HTML> <HEAD> <TITLE>Фильтр blendTrans</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function f() { img.filters.blendTrans.Apply(); img.src="ris.bmp"; img.filters.blendTrans.Play(); } //--> </SCRIPT> </HEAD> <BODY> <IMG ID="img" SRC="handshak.bmp" STYLE="filter:blendTrans(Duration=8);" […]

Динамические фильтры (переходы)

    На этом шаге мы рассмотрим общие свойства и методы переходов.     Динамические фильтры или переходы используют в Web для создания эффекта анимации. По сути, это обычное трансформирование одного изображения в другое различными способами.     Прежде чем рассматривать конкретные переходы, перечислим некоторые свойства-параметры, которые присущи всем динамическим фильтрам: Duration - определяет интервал времени, за который […]

Фильтр wave

    На этом шаге мы рассмотрим фильтр wave.     Фильтр wave делает объект волнистым. Синтаксис: STYLE="filter:wave(Add=<логическое значение или число>, Freq=<число>, LightStrength=<число>, Phase=<число>, Strength=<число>)"     Опишем назначение каждого параметра. Add - значение, определяющее, добавлен ли первоначальный объект (true или ненулевое число) к фильтрованному объекту или нет (false или нуль). Freq - целое значение, определяющее число волн. […]

Фильтры mask, shadow и xray

    На этом шаге мы рассмотрим фильтры mask, shadow и xray.     Фильтр mask выделяет объект, как если бы вы его выделили мышью, при этом можно задать цвет выделения. Синтаксис: STYLE="filter:mask(Color=<цвет>)", где Color - цвет, используемый для выделения.     На рисунке 1 приведен пример использования этого фильтра. Пример текста Рис.1. Результат использования фильтра mask (наведите […]

Фильтр light

    На этом шаге мы рассмотрим фильтр light.     Фильтр light добавляет к изображению источник света. Пожалуй, самый интересный фильтр, так как имеет лишь единственное свойство enabled и много методов, которые позволяют создавать различные световые эффекты.     Методы, применяемые к этому фильтру: AddAmbient (<число_красный>, <число_зеленый>, <число_синий>, <число_интенсивность>) - добавляет источник рассеянного света с заданными цветовыми […]

Фильтры gray и invert

    На этом шаге мы рассмотрим фильтры gray и invert.     Фильтр gray отображает объект в черно-белой цветовой гамме.     На рисунке 1 приведен пример использования этого фильтра. Рис.1. Результат использования фильтра gray (наведите курсор мыши на рисунок)     Фильтр invert меняет цвет, оттенок, насыщенность объекта на противоположные.     Пример использования фильтра изображен на рисунке […]

Фильтр glow

    На этом шаге мы рассмотрим фильтр glow.     Фильтр glow добавляет сияние вокруг объекта. Его общий вид: STYLE="filter:glow(Color=<цвет>, Strength=<число>)" .     Свойство Strength, изменяющееся от 0 до 255, определяет интенсивность "свечения" контура изображения объекта, а свойство Color - цвет "свечения".     На рисунке 1 приведен пример использования этого фильтра. Пример текста Рис.1. Результат использования […]

Фильтры flipH и flipV

    На этом шаге мы рассмотрим фильтры flipH и flipV.     Фильтр flipH переворачивает объект горизонтально.     Пример использования фильтра изображен на рисунке 1. Пример текста Рис.1. Результат использования фильтра flipH (наведите курсор мыши на текст)     Фильтр flipV переворачивает объект вертикально.     Пример использования фильтра изображен на рисунке 2. Пример текста Рис.2. Результат использования […]

Фильтр dropShadow

    На этом шаге мы рассмотрим фильтр dropShadow.     Фильтр dropShadow добавляет силуэт объекта, смещенный в определенном направлении. Его общий вид: STYLE="filter:dropShadow(Color=<цвет>, OffX=<число>, OffY=<число>, Positive=<логическое значение или число>)"     У фильтра dropShadow кроме свойства Color, задающего цвет тени, имеется ряд свойств, задающих параметры падающей тени. Свойства OffX и OffY определяют количество пикселей в горизонтальном и […]