Динамические фильтры
Динамические фильтры
Эффекты постепенного появления (исчезновения) графического изображения и преобразования одной картинки в другую можно получить с помощью совместного применения динамического фильтра и сценария (скрипта). Разумное использование таких эффектов украшает Web-страницу. Есть несколько способов преобразования. Эти способы заранее определены, поэтому от вас лишь требуется указать номер выбранного способа. Ниже приведена таблица с названиями и номерами превращений.
Тип превращения | Номер фильтра |
Стягивающийся прямоугольник | 0 |
Расширяющийся прямоугольник | 1 |
Стягивающийся круг | 2 |
Расширяющийся круг | 3 |
Стирание вверх | 4 |
Стирание вниз | 5 |
Стирание вправо | 6 |
Стирание влево | 7 |
Вертикальные жалюзи | 8 |
Горизонтальные жалюзи | 9 |
Сужающиеся клетки | 10 |
Закрывающаяся шахматная доска | 11 |
Случайный наплыв | 12 |
Вертикальное деление внутрь | 13 |
Вертикальное деление наружу | 14 |
Горизонтальное деление внутрь | 15 |
Горизонтальное деление наружу | 16 |
Стирание влево вниз | 17 |
Стирание влево вверх | 18 |
Стирание вправо вниз | 19 |
Стирание вправо вверх | 20 |
Случайные горизонтальные полосы | 21 |
Случайные вертикальные полосы | 22 |
Случайный выбор номера (из диапазона 0-22) | 23 |
В следующем примере картинка с изображением карты мира постепенно становится видимой через открывающиеся вертикальные жалюзи. Картинка из файла word.gif сначала невидима (свойство visibility:hidden таблицы стилей). В тэге <DIV> применен динамический фильтр revealtrans, управляющий появлением изображений. Сценарий содержит одну функцию dyn_filter (), которая применяет фильтр (метод apply ()), делает картинку видимой (свойству visibility присваивается значение «visible»), устанавливает тип преобразования (Transition=8) и задает длительность преобразования 2 с (методу play () передается числовой параметр 2). Далее определено, что эффект постепенного появления картинки начнется сразу же после загрузки страницы. Это достигается привязкой функции dyn_filter () к событию ONLOAD в тэге<ВОDУ>.
<HTML>
<HEAD> <TITLE> Динамический фильтр </TITLE>
<SCRIPT >
function dyn fliter () {
Imagel . filters (0) . apply ()
I1 . style .visibility" visible" Imagel . filters (0) .Transition=8
Imagel .filters (0) .play(2)
}
</SCRIPT>
</HEAD>
<BODY ONLOAD="dyn_filter () ">
<DIV ID=Imagel STYLE1="position: absolute;
height: 2 00; width: 300; left: 10; top : 10; filter : reveal trans">
<IMG ID=I1 STYLE1="position:absolute; '
height : 200; width: 300; visibility : hidden" SRC=world. gif >
<H3 STYLE1= "posit ion: absolute; top:210">
Динамическое преобразование картинки с помощью фильтра </НЗ>
</BODY>
</HTML>