Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Подготовка к экзамену по ТП.doc
Скачиваний:
2
Добавлен:
20.09.2019
Размер:
1.13 Mб
Скачать

30. Отображение списков.

Четыре свойства каскадных таблиц стилей влияют на отображение списков, задаваемых тэгами <OL> и <UL>. Свойство list-style-type определяет тип маркера списка, если значение свойства list-style-image установлено равным none или графическое изображение, определенное в этом свойстве функцией url (), не доступно. Допустимые значения этого свойства показаны в табл. 10.6.

Таблица 10.6. Значения свойства list-style-type

Значение

Вид маркера

none

Маркер не отображается

disk

Закрашенный кружок

circle

Не закрашенный кружок

square

Закрашенный квадрат

decimal

Арабская цифра с точкой

lower-roman

Римская строчная цифра с точкой

upper- roman

Римская прописная цифра с точкой

lower-alpha

Латинская строчная буква с точкой

upper-alpha

Латинская прописная буква с точкой

Свойство list-style-image определяет графическое изображение, которое будет использоваться в качестве маркера списка, если оно доступно. Значениями этого свойства могут быть либо none (не задается никакое изображение для маркера), либо полный или относительный адрес графического файла, задаваемый с помощью функции url (): OL {list-style-image: url(http://www.bhv.com/list.gif) }

Свойство list-style-position определяет положение маркера в списке: в составе абзаца пункта списка (значение inside) или выдвинутым влево от него (значение outside):

<DIV STYLE="position:absolute; top: Opx; left: 20px; width: 300px">

< UL STYLE="list-style-position: inside"> Список 1

<LI> Абзац первого перечисления в списке. Маркер в составе абзаца.

<LI> Абзац второго перечисления в списке. Маркер в составе абзаца.

</UL>

</DIV>

<DIV STYLE="position:absolute; top: 0px; left: 400px; width: 300px">

<UL STYLE="list-style-position: outside"> Список 2

<LI> Абзац первого перечисления в списке. Маркер впереди абзаца.

<LI> Абзац второго перечисления в списке. Маркер впереди абзаца. </UL> </DIV>

Результаты отображения этих двух списков показаны на рис. 10.13.

Как и для большинства свойств каскадных таблиц стилей, так и для этих свойств определено свойство, в котором можно одновременно определить значения всех свойств отображения списка. Значением свойства list-style является список значений свойств list-style-type, list-style-image и list-style-position: OL {list-style: circle url(list.gif) inside}

Примечание

Свойства группы "Фильтры и переходы" используются для создания динамических визуальных эффектов в HTML-документах, и поэтому их описание будет дано ниже в разделе "Динамический HTML в Internet Explorer".

31. Фильтры и переходы.

Создавать HTML-страницы с мультимедийными эффектами также просто, как и применять каскадные таблицы стилей. Разнообразные визуальные динамические эффекты: постепенное "проявление" изображения или текста, изменение контрастности графического изображения, "свечение" букв текста и т. п. — все это и многое другое можно увидеть при отображении страницы в Internet Explorer 4.0 и более поздних версий. Реализуются мультимедийные эффекты применением фильтров к элементам страницы и организацией переходов из одного визуального состояния к другому. Фильтр — это некоторый алгоритм, преобразующий визуальное отображение элемента в окне браузера.

Он может быть статическим или динамическим. Статический фильтр преобразует элемент, и после этого он отображается. Динамический фильтр воздействует во времени на визуальное отображение элемента, меняя его непосредственно на HTML-странице, что приводит к эффекту анимации. Динамический фильтр еще называют переходом из одного состояния отображения в другое. Фильтры применяются не ко всем HTML-элементам, а только к тем, которые могут определять прямоугольный блок при отображении в окне браузера и не являются окнами, как, например, элемент . Создавать HTML-страницы с мультимедийными эффектами также просто, как и применять каскадные таблицы стилей. Разнообразные визуальные динамические эффекты: постепенное "проявление" изображения или текста, изменение контрастности графического изображения, "свечение" букв текста и т. п. — все это и многое другое можно увидеть при отображении страницы в Internet Explorer 4.0 и более поздних версий. Реализуются мультимедийные эффекты применением фильтров к элементам страницы и организацией переходов из одного визуального состояния к другому.

Фильтр — это некоторый алгоритм, преобразующий визуальное отображение элемента в окне браузера. Он может быть статическим или динамическим. Статический фильтр преобразует элемент, и после этого он отображается. Динамический фильтр воздействует во времени на визуальное отображение элемента, меняя его непосредственно на HTML-странице, что приводит к эффекту анимации. Динамический фильтр еще называют переходом из одного состояния отображения в другое.

Фильтры применяются не ко всем HTML-элементам, а только к тем, которые могут определять прямоугольный блок при отображении в окне браузера и не являются окнами, как, например, элемент <IFRAME>. В табл. 10.9 перечислены все элементы HTML, к которым могут применяться фильтры.

Таблица 10.9. Элементы, к которым применяются фильтры

Элемент

Фильтр применяется

BODY

Всегда

BUTTON

Всегда

DIV

Если заданы ширина (свойство width), высота (свойство height) или элемент абсолютно позиционирован

IMG

Всегда

INPUT

Всегда

MARQUEE

Всегда

SPAN

Если заданы ширина (свойство width), высота (свойство height) или элемент абсолютно позиционирован

TABLE

Всегда

TD

Всегда

TEXTAREA

Всегда

TH

Всегда

Примечание

Фильтры можно применять и к элементам управления ActiveX, встраиваемым в HTML-страницу.

Фильтры не применяются к следующим элементам HTML-страницы: апплеты Java, IFRAME, SELECT, OPTION, P, EM, STRONG и ко всем заголовкам H1, H2 и т. д. Применить фильтр к элементу просто: достаточно задать значение его свойства filter, следуя правилам задания свойств каскадных таблиц стилей filter: значение. Каждый фильтр, как отмечалось выше, реализует определенный алгоритм преобразования видимого отображения элемента, поэтому значение свойства filter задается в форме функции: filter: имя_фильтра([параметры]); а параметры фильтра, если они присутствуют, задаются с использованием синтаксиса именованных параметров функции: имя_параметра=значение_параметра. Некоторым фильтрам требуется несколько параметров, задаваемых через запятую, а некоторым фильтрам параметры вообще не нужны, но круглые скобки должны присутствовать обязательно. К элементу можно применить несколько фильтров одновременно. В этом случае они задаются в виде списка с пробелом в качестве разделителя:

<IMG ID=img1 SRC="пример1.gif" STYLE="filter: blur(strength=50) fliph()>

В данном примере к графическому изображению применяются два фильтра: первый (blur) размазывает изображение на глубину в 50 пикселов, а второй (fliph) просто зеркально его отображает в горизонтальном направлении. В Internet Explorer реализовано большое число разнообразных фильтров. В табл. 10.10 представлены все фильтры с кратким описанием их воздействия на визуализацию элементов.

Таблица 10.10. Доступные в Internet Explorer фильтры

Фильтр

Описание

alpha

Устанавливает уровень непрозрачности объекта

blendTrans

Увеличивает или уменьшает контрастность отображения объекта

blur

Создает эффект размытия изображения

chroma

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

dropShadow

Рисует сплошной силуэт объекта, смещенный в заданном направлении, создавая тем самым эффект объекта, расположенного над страницей и отбрасывающего на нее тень

flipH

Рисует объект в зеркальном отображении относительно горизонтальной плоскости

flipV

Рисует объект в зеркальном отображении относительно вертикальной плоскости

glow

Добавляет свечение вдоль внешних границ объекта, создавая эффект "возгорания" границ объекта

gray

Удаляет цветовую гамму объекта и отображает его в серых тонах

invert

Меняет оттенок, насыщение и яркость объекта на противоположные

light

Подсвечивает объект

mask

Закрашивает прозрачные пикселы объекта заданным цветом и создает прозрачную маску из непрозрачных пикселов объекта

redirect

Преобразует объект в объект DAimage, к которому можно применить все возможности технологии MS DirectAnimation

revealTrans

Показывает или скрывает объекты, используя 23 определенных в фильтре перехода

shadow

Рисует силуэт объекта вдоль одной из его границ в заданном направлении, создавая эффект тени

wave

Синусоидальное искривление объекта в вертикальном направлении, создавая эффект волнообразной поверхности

xray

изменяет глубину цвета объекта и после этого отображает его в черно-белых тонах, имитируя рентгеновский снимок объекта

Ограниченные объемы книги не позволяют полностью описать каждый фильтр со всеми параметрами и нюансами использования, но некоторые, наиболее часто применяемые разработчиками Web-документов, фильтры будут описаны достаточно подробно.

интересные динамические эффекты достигаются использованием фильтров совместно со сценариями. В процессе выполнения сценария можно устанавливать или изменять параметры применяемых к объектам фильтров, можно назначать новые фильтры, создавать визуальные эффекты через определенные интервалы времени и делать многое другое. Доступ к фильтрам и их параметрам в программируемых сценариях осуществляется, как обычно, с помощью объектной модели, предоставляемой браузером. В этой модели любой фильтр представляется в виде обычного объекта со своими свойствами и методами.

Большинство свойств и методов соответствует параметрам фильтра, определяемым при задании фильтра в параметре STYLE. Некоторые свойства и методы доступны только из программируемого сценария. Определить, какие фильтры применены к элементу, можно с помощью набора filters соответствующего объекта. В нем хранятся ссылки на все применяемые к элементу фильтры:

<IMG ID=picture SRC="picture.gif"

STYLE="filter: wave(strength=100) gray() fliph()">

.  .  .  .

<SCRIPT>

strengthWave=picture.filters.wave.strength;

if( picture.filters['gray'].enabled && strengthWave >= 100) {

picture.filters.wave.strength += 50

}

</SCRIPT>

В приведенном примере объект picture сценария соответствует элементу <IMG> HTML-страницы. Переменная strengthWave хранит значение параметра strength фильтра wave. Оператор условия проверяет, не отключался ли фильтр gray объекта picture ранее в каком-либо сценарии (значение свойства enabled фильтров равно true, если разрешено его применение к элементу). Если этот фильтр продолжает применяться, и параметр strength фильтра wave больше или равен 100, то этот параметр увеличивается на 50. Можно ссылаться на фильтры объекта и с помощью числового индекса набора filters. Каждому фильтру, заданному в параметре или тэге STYLE, соответствует определенный числовой индекс этого набора. Все фильтры индексируются в порядке их перечисления в свойстве filter каскадных таблиц стилей, начиная с нуля. Так, в приведенном примере фильтру wave соответствует индекс 0, фильтру gray — 1 и фильтру fliph — 2. Поэтому получить значение параметра strength фильтра wave можно было бы и так:

strengthWave=picture.filters[0].strength;

Совет

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

В наборе style объекта, в котором хранятся значения всех свойств каскадных таблиц стилей соответствующего объекту элемента HTML, хранится и значение свойства filter объекта, являющееся строкой, содержащей список применяемых к элементу фильтров. Если в предыдущем примере в сценарий добавить оператор alert(picture.style.filter) ; то в диалоговом окне, выводимом функцией alert (), будет отображена следующая строка: wave(strength=100) gray() fliph(). Это свойство можно использовать для динамического изменения присоединенных к элементу фильтров. Добавить фильтр fiipvO к элементу picture того же примера можно простым оператором: picture.style.filter += ' flipv()';

Предупреждение

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

О бщие свойства некоторых фильтров

Каждый фильтр имеет свойство enabled, которое разрешает (значение true) или запрещает (значение alse) применение присоединенного к объекту фильтра. Это свойство соответствует параметру ENABLED при задании фильтра в тэге HTML-элемента.

С войство strength фильтров blur, glow и wave определяет интенсивность применения соответствующего фильтра и может изменяться от 0 до 255. Для blur это будет степень размытости изображения элемента, для glow — интенсивность "свечения" контура изображения объекта, для wave — амплитуда волны искажения. На рис. 10.20 показаны изображения одного и того же фрагмента текста, обработанного фильтрами wave различной интенсивности.

Примечание

Обратите внимание, что некоторые символы, расположенные близко к границам блока отображения элемента, при использовании фильтра wave преобразуются таким образом, что выходят за область отображения.

Фильтры, воздействующие на цветовую гамму элемента, имеют свойство (и, естественно, параметр) color. К ним относятся следующие фильтры: chroma, dropShadow, glow, mask, shadow. Как и в случае свойства strength, свойство color для разных фильтров определяет разные цветовые эффекты, связанные с воздействием фильтра на объект. Для фильтров dropshadow и shadow это свойство задает цвет создаваемой тени, в фильтре glow оно определяет цвет "свечения" контура элемента, в фильтрах chroma и mask значением этого свойства задается цвет пикселов объекта, которые становятся прозрачными, или цвет, в который окрашиваются прозрачные пикселы объекта.

Значение этого свойства задается шестнадцатеричным числом вида #RRGGBB или одним из зарезервированных слов, обозначающих определенные цвета, например magenta, lightsteelblue и т. д.

Рис. 10.20. Воздействие фильтра wave на отображение текста

Свойство direction фильтров blur и shadow определяет, соответственно, направление, в котором размывается изображение объекта, и направление падения тени от объекта. Значением этого свойства является угол, отсчитываемый от вертикали объекта по часовой стрелке с шагом в 45°. Отрицательные значения или значения, большие 360°, приводятся к эквивалентным значениям в диапазоне от 0° до 360°. Например, значение -45° соответствует 315°.

Булево свойство add определяет, включать (значение true) или не включать (значение false) исходное изображение объекта, к которому применяется фильтр, в отфильтрованный образ. Это свойство имеют только два фильтра: blur и wave. На рис. 10.21 показаны три графических файла буквы Ж: первый отображается без применения фильтров, второй — с применением фильтра размывания изображения blur интенсивности 100, третий — аналогичен второму, но с добавленным исходным изображением. В серых тонах трудно найти различия во втором и третьем изображениях, но в цвете видно, что в третьем изображении четче прорисовывается сама буква "Ж", а вдоль контура наблюдается размытие.

Перечисленные выше свойства полностью исчерпывают описание некоторых фильтров, так как они не имеют методов, или только свойств фильтров. Все такие фильтры приведены в табл. 10.11.

Рис. 10.21. Эффект от добавленного исходного изображения в фильтр

Таблица 10.11. Свойства и методы некоторых фильтров

Фильтр

Свойства

Методы

blur

add, direction, enabled, strength

Нет

chroma

color, enabled

Нет

flipH

Enabled

Нет

flipV

Enabled

Нет

glow

color, enabled, strength

Нет

gray

Enabled

Нет

invert

Enabled

Нет

light

Enabled

AddAmbient, addCone, addPoint, changeColor, changeStrength, clear, moveLight

mask

color, enabled

Нет

redirect

Enabled

Element Image

shadow

color, direction, enabled

Нет

xray

Enabled

Нет

О писание фильтров

Фильтр wave имеет свойства-параметры add, enabled, strength, freq, phase и lightStrength. Первые три свойства описаны выше. Свойства freq и phase определяют количество максимумов в синусоидальной волне искажения и фазу смешения волны, которая задается в процентах от фазы обычной синусоиды, имеющей начальное значение 0. Величина этого параметра, равнал 100, соответствует фазе смещения в 360°. Все остальные значения лежат в интервале от 0 до 100. Например, значение phase: 25 соответствует синусоиде с фазой смещения в 90°. Последнее свойство lightstrength определяет интенсивность освещения для имитации трехмерного эффекта поднятия гребней волны. На рис. 10.22 показаны изображения после обработки фильтром wave с различными параметрами. Примечание Чем сильнее интенсивность освещения, тем темнее горизонтальные полосы, имитирующие выпуклости и вогнутости синусоиды. У фильтра dropshadow кроме свойств color и enabled имеется ряд свойств, задающих параметры падающей тени. Свойства offX и offY определяют количество пикселов в горизонтальном и вертикальном направлениях, на которые смещается тень от как бы приподнятого над плоскостью страницы объекта, а свойство positive определяет, должен ли фильтр создавать падающую тень от прозрачных пикселов объекта. Если значение этого свойства true, то тень создается от непрозрачных пикселов объекта, если false — от прозрачных. Положительное значение свойства offX смещает тень вправо, отрицательное — влево; положительное значение свойства offY смещает тень вниз, отрицательное — вверх. На рис. 10.23 показаны эффекты от применения этого фильтра.

Совет

Если на странице есть прозрачный объект, то можно получить его тень, применив к нему фильтр dropShadow и установив значение его параметра positive равным 0.

Фильтр alpha позволяет создавать эффекты прозрачности (невидимости) отображения или его части. Свойство opacity определяет степень прозрачности: значение о соответствует полной прозрачности (невидимости) изображения, а значение 10 — нормальному изображению. Параметр style определяет способ создания эффекта прозрачности. Его умалчиваемое значение равно о и соответствует изменению прозрачности всего изображения. Ненулевое значение означает, что прозрачность объекта не однородна и изменяется от пиксела к пикселу. При style=i параметры startx, startY и finishX, finishY определяют координаты точек прямой, на которой прозрачность равна значению параметра finishopacity. Прозрачность точек, лежащих между границами объекта и этой прямой, меняется от значения, заданного свойством opacity, до значения, заданного свойством finishopacity. При значении style=2 степень прозрачности точек изображения меняется при перемещении из центра к эллипсу (вписанному в прямоугольный блок отображения элемента) от значения, определяемого свойством opacity, до значения, заданного параметром finishopacity. Вне вписанного эллипса прозрачность соответствует finishopacity. Если style=3, прозрачность аналогичным образом меняется от центра до границ изображения. Комбинируя значения свойств фильтра alpha можно создавать разнообразные эффекты отображения объекта. Некоторые возможности показаны на рис. 10.24. Фильтр light, возможно самый интересный из всех фильтров, имеет единственное свойство enabled и много методов, которые позволяют добавлять к изображению объекта разнообразные источники света. Метод addAmbient(iRed, iGreen, iBlue, iStrength) добавляет рассеянный источник света, который представляет собой ненаправленный источник света, распространяющий параллельные лучи перпендикулярно к поверхности страницы. Его параметры iRed, iGreen, iBlue задают, соответственно, насыщенность красной, зеленой и синей составляющей света и изменяются в диапазоне от 0 до 255. Параметр istrength определяет интенсивность источника. Направленный конический источник света добавляется методом addCone(iX1,iY1,iZ,1X2,iY2, iRed, iGreen, iBlue,istrength,iAngle), где:

iX1,iY1 — определяют координаты источника света в пикселах,

iZ — задает номер слоя,

ix2, iY2 — определяют координаты точки направления света,

iRed, iGreen, iBlue — задают насыщенности соответствующих цветовых составляющих,

istrength — интенсивность источника света, iAngle — угол конуса распространения света.

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

Точечный источник света добавляется к объекту методом

addPoint(iX1,iY1,iZ,iRed,iGreen, iBlue,istrength)

Первые два параметра задают координаты источника света в пикселах, третий — номер слоя источника света. Остальные параметры имеют тот же смысл, что и в предыдущих методах добавления источников света. На рис. 10.25 можно увидеть все три источника, присоединенные к графическому изображению. Все источники добавляются только из встроенного сценария. Для HTML-страницы, отображенной на рис. 10.25, исходный текст выглядит следующим образом:

<HEAD><SCRIPT>

window.onload=fnInit;

function fnInit(){var iX2=img2.offsetWidth/2;

var iY2=img2.offsetHeight/2;

var iX3=img3.offsetWidth/2;

var iY3=img3.offsetHeight/2;

img1.filters.light.enabled=true;

img1.filters.light.addAmbient(255,0,0,255);

i mg2.filters.light.enabled=true;

img2.filters.light.addCone(0,0,3,iX2,iY2,255,255,255,255,20);

img3.filters.light.enabled=true;

img3.filters.light.addPoint(iX3, iY3, 3, 255, 255, 255, 255);

} </SCRIPT> </HEAD>

<DIV STYLE='position: absolute; top:0; left: 0; width: 190'>

<IMG SRC='flower.jpg'>Нормальное изображение</DIV>

<DIV STYLE='position: absolute; top:0; left: 195; width: 190'>

<IMG ID=img1 SRC='flower.jpg' STYLE="filter: light()">

Рассеянный источник красного</DIV>

<DIV STYLE='position: absolute; top:0; left: 390; width: 190'>

<IMG ID=img2 SRC='flower.jpg' STYLE="filter:light();">

Конический источник </DIV>

<DIV STYLE='position: absolute; top:0; left: 585; width: 190'>

<IMG ID=img3 SRC='flower.jpg' STYLE="filter:light(); height:190">

Точечный источник света</DIV>

Примечание При добавлении фильтра light() в параметре STYLE область отображения элемента становится черной, чтобы можно было видеть эффекты конического и точечного источников света.

Примечание Точечный источник света может представлять собой один пиксел, если не подобран его цвет и цвет элемента. Лучше всего этот источник света виден на белом фоне.

Оригинальные эффекты с источниками света достигаются из встроенных сценариев. Большое количество подобных примеров можно найти на сервере разработчика фирмы Microsoft по адресу http://msdn.microsoft.com /workshop/author/.

Описание переходов В Internet Explorer включено два перехода: blendTrans и revealTrans. Напомним, что переход позволяет переходить во времени от одного визуального состояния к другому, задавая длительность перехода. Переходы в Web-документах используются для создания эффекта анимации, например преобразования одного изображения в другое. Свойство-параметр duration определяет интервал времени, необходимый для выполнения перехода. Его значением является действительное число с плавающей точкой в формате секунды.миллисекунды. В сценариях его можно изменять, если только не началось выполнение перехода. Свойство status, доступное только из сценария, позволяет определить состояние перехода: 0 — переход остановлен, 1 — переход применен и 2 — переход выполняется. Переход blendTrans задает постепенное исчезновение или появление изображения, увеличивая или уменьшая степень его прозрачности. исчезновение или появление моделируется совместным использованием перехода и свойства visibility объекта. Следующий пример демонстрирует постепенное исчезновение одной картинки и появления другой.

Пример 10.9. Анимационный эффект

<HTML><SCRIPT language="JavaScript">

var fRunning = 0

function startTrans()

{if (fRunning == 0) {fRunning = 1 img.filters.blendTrans.Apply(); img.src = "Арнольд1.bmp"; img.filters.blendTrans.Play()} </SCRIPT><SCRIPT for="img" event="onfilterchange"> fRunning = 0 </SCRIPT></HEAD><BODY><IMG id="img" src="Арнольд.Bmp" style="filter:blendTrans(duration=8); width: 400; height: 250;" onclick="startTrans()"></BODY></HTML>

В этом примере к изображению img применяется переход blendTrans, который постепенно в течение 8 секунд делает прозрачным изображение файла Арнольд.Bmp, а вместо него отображается содержимое файла Арнольд1.bmp. инициализация перехода осуществляется щелчком мыши на изображении. При начале выполнения перехода генерируется событие onfiiterchange, в процедуре обработки которого задается начальное значение переменной fRunning. В процедуре обработки щелчка мыши вызывается метод applay (), после которого можно устанавливать новые значения параметров объекта img. В примере задается новый файл изображения. На рис. 10.26 показано начальное изображение (а), промежуточное (б) и окончательное (в). Три метода переходов предназначены для управления выполнением перехода из сценария. Для их выполнения не требуется никаких параметров. Метод apply () "замораживает" видимое в данный момент изображение элемента и позволяет изменить значения параметров перехода и самого элемента, не требуя немедленного применения перехода. Чтобы выполнить переход после переустановки значений необходимых параметров, следует спользовать метод play (). Остановить выполнение перехода для элемента в любой момент времени можно методом stop (). Переход revealTrans позволяет, в отличие от перехода blendTrans, выполнить переходы из одного видимого состояния в другое разнообразными способами. Его свойство transition может иметь целое значение и определяет тип перехода. Допустимые значения представлены в табл. 10.12.

Таблица 10.12. Типы переходов в фильтре revealTrans

Переход

Отображение объекта

Переход

Отображение объекта

0

Сжимающийся прямоугольник

12

Пикселы отображаются в случайном порядке

1

Расширяющийся прямоугольник

13

Одновременно слева и справа к центру

2

Сжимающийся круг

14

Одновременно от центра налево и направо

3

Расширяющийся круг

15

Одновременно снизу и сверху к центру

4

Разворачивание снизу вверх

16

Одновременно от центра вверх и вниз

5

Разворачивание сверху вниз

17

От правого верхнего угла к левому нижнему

6

Разворачивание слева направо

18

От правого нижнего угла к левому верхнему

7

Разворачивание справа налево

19

От левого верхнего угла к правому нижнему

8

Вертикальные жалюзи

20

От левого нижнего угла к правому верхнему

9

Горизонтальные жалюзи

21

Случайными горизонтальными линиями

10

В шахматном порядке noneрек

22

Случайными вертикальными линиями

11

В шахматном порядке вниз

23

Отображение пикселов случайным образом

   

На рис. 10.27 (а, б, в) показаны результаты применения перехода revealTrans со значением параметра transition=1 вместо перехода blendTrans в примере 10.9. В этом случае новый рисунок прорисовывается в течение 8 секунд расширяющимся из центра прямоугольником. Промежуточное отображение перехода показано на рис. 10.27, б.

Мы привели достаточно простые примеры применения переходов. Более сложные примеры использования фильтров и переходов можно найти на сервере разработчика фирмы Microsoft по адресу http://msdn.microsoft.com /workshop/author/.

52