Введение
Итак, вы уже умеете делать простейшие HTML странички, выводя на них текст,
рисунки и даже пускать бегущую строку. Но все же, путешествуя по Интернету, вы
каждый раз поражаетесь красоте и качеству, с которым выполнены тамошние
страницы. Оговорюсь сразу - это пособие не сделает из вас профессионального
дизайнера Web страниц, но при наличие элементарной фантазии и желания дочитать
этот текст до конца, вы сможете поднять свой уровень до будущего
профессионального креатора HTML.
Так что такое Dynamic HTML? DHTML - это набор нововведений в Microsoft Internet
Explorer 4.0, которые позволяют автору страницы динамически менять стили,
содержание и оформление страницы, создавать интерактивные документы, реагирующие
с пользователем в реальном масштабе времени. Короче, DHTML - это красота в Web
страницах.
Глава 1. Динамические стили .
Динамические стили - одно из оснований DHTML. Путем нехитрых функций вы можете
менять внешний вид любого элемента в любой момент времени, например, цвет ссылки
изменится, когда пользователь наведет на нее курсор.
Каждый объект HTML имеет набор свойств, определяющих его внешний вид. Все они
объединены в подмножестве Style. Доступ к этим свойствам можно получить двумя
путями: через язык HTML - общепринятый набор описаний для HTML документа, или
через несколько других Web-языков - JavaScript, JScript или VBScript. Если
учесть, что перые два - практически одно и тоже, то остается, что выбор не так
уж и велик. Поскольку язык JScrript является (на мой вкус) самымы легким, а
также самым распространенным, далее в этом документе будет употреблен именно он.
При этом, так как мы не собираемся вдаваться в дебри программирования на новом
незнакомом языке, его изучению здесь не будет придано очень пристального
внимания, а только приведены самые элементарные примеры его использования. Если
вы уже немного знакомы с этим языком или имеете представление о том, как
вставлять в HTML документ объект Script, то можете идти дальше, если же нет,
прочтите краткий курс об этом, воспользовавшись этой ссылкой.
Итак, с помощью динамических стилей вы можете менять любое визуальное свойство
объекта - цвет, размер, видимость и многое другое. Производить эти операции
легко с помощью Script языков, в нашем случае это будет JScript.
Далее,вы сможете получить информацию по следующим разделам:
Создание динамических стилей
Установка стиля объекта
Классы
Изменение стиля через Script-язык
Динамика в самом Internet Explorer 4.0
Сделаем стили динамическими
Динамический - означает изменение свойcтв в реальном времени, например при
совершении какого-либо события. События - это ядро любых современных языков
программирования. Следующая строчка, вставленная в стандартное ядро HTML
страницы заставляет объект заголовка изменить свой цвет, когда пользователь
наведет на него мышь.
Эта строка покраснеет
Этот простой пример иллюстрирует доступ к свойству color элемента H1. Все
действие, собственно, происходит в выражении
onmouseover="this.style.color='red'"; Это выражение языка JScript означает, что
при происхождении события onmouseover объект, с которым произошло событие
(this-это), его множество style и свойство в этом множестве - color должно
поменять свое значение на 'red'. (Заметьте, что red пишется в одинарных
кавычках. Это значит, что red - символьная строка, а не какая-нибудь переменная)
Чтобы при выходе из зоны объекта, он снова менял свой цвет, например обратно,
используйте событие onmouseout.
onmouseout="this.style.color='black';">
Эта строка динамически изменяет свой цвет
