|
|||
|
|||
Использование визуальных фильтров в IE 5 |
|||
Мы уже рассматривали возможности фильтров визуальных элементов в IE версии 4 и выше. Теперь посмотрим как это можно применить на практике. Те из вас, кто уже поставил Windows 2000, заметили, что теперь для появляющихся (pop-up) меню можно выбрать эффект постепенного появления этого меню. Посмотрим, что можно сделать, чтобы получить подобный эффект на своей странице. Для этого можно использовать фильтр прозрачности alpha. Для того, чтобы поменять параметры фильтра необходимо обратиться к совойству filters элемента. Например, так: alert(element.filters.alpha); Эффекта постепенного появления можно достигнуть путем последовательного изменения параметра opacity этого фильтра. Делаем это с помощью следующей процедуры: 0:function showMenu(el) { el - элемент, прозрачность которого мы меняем. В строчке 2 параметр step указывает шаг изменения прозрачности. Каждый вызов функции showMenu() вызывает уменьшение (напомню, что параметр opacity отвечает за "непрозрачность", следовательно его увеличение приводит к уменьшению прозрачности) прозрачности. В строчке 3 мы вызываем эту функцию через некоторый промежуток времени. Напомню, что прозрачность изменяется от 0 (полностью прозрачно) до 100 (полностью непрозрачно). В строчке 6 мы останавливаем процесс изменения прозрачности. Подобным образом мы реализуем эффект постепенного исчезновения элемента: 0:function hideMenu(el) { Не вредно будет "спрятать" элемент после того, как он станет прозрачным. Для данного элемента я применил следующее описание стиля: .menu { Параметры фильтра alpha указывают на то, что элемент полностью прозрачен (Opacity=0), а стиль прозрачности - равномерная (Style=0). Кроме того, элемент изначально не виден (visibility: hidden;). С помощью данной технологии я реализовал простенькое меню, которое использует эффект, аналогичный использованому в Windows 2000. Предлагаю скачать данный скрипт и использовать на своем сайте. Небольшое описание внутри. И напоследок замечу, что пользователи браузеров, отличных от IE5, скорее всего ничего не увидят, так что не забудьте предусмотреть альтернативу данному меню.
Это сокращенный вариант статьи. Полный вариант см. на сайте http://exper.ural.ru/
|
|||
|
|||
Copyright © "Internet Zone", info@izcity.com | |||
Копирование и использование данных материалов разрешается только в случае указания на журнал "Internet Zone", как на источник получения информации. При этом во всех ссылках обязательно явное указание адреса вэб-сайта http://www.izcity.com/. При наличии у копируемого материала авторов и источника информации - их также нужно указывать, наряду со ссылкой на нас. |