Категория
Информатика
Тип
реферат
Страницы
6 стр.
Дата
30.01.2009
Формат файла
.rtf — Rich Text Format (Wordpad)
Архив
20595.zip — 7.88 kb
  • javascript-poleznye-funkcii_20595_1.rtf — 36.65 Kb
  • Readme_docus.me.txt — 125 Bytes
Рейтинг
10  из 10
Оценок
1
Оцените работу
Хорошо  или  Плохо


Текст работы

JavaScript: полезные функции
Mike Melnikov
Эффект, который мы сейчас рассмотрим, является, пожалуй, самым распространенным. И заключается он в смене изображения при наведении на него мышкой. Часто можно слышать английское название эффекта - RollOver, что обычно переводят как "перекатывание". Мне не кажется это название удачным, но все же, давайте приступим.
Эффект может встречаться в различных вариантах, самые распространенные из которых это:
подсвечивание пунктов меню
бегающий указатель
сменяющаяся картинка
Несмотря на внешне различное проявление этих эффектов, все они реализованы схожим образом и отличаются лишь в мелочах. Давайте, по порядку разберем каждый из этих вариантов.
Подсвечивание пунктов меню
Наиболее часто встречающаяся реализация эффекта RollOver. Его основой является подмена картинки при наведении курсора мышки и возврат к первоначальной после того, как мышка ее покинет.
Для начала, нам будет необходимо нарисовать каждую кнопку меню в двух вариантах: в "отжатом" и "нажатом" состояниях. Будем считать, что это
уже сделано и перейдем к рассмотрению механизма, который обеспечивает нужную нам функциональность.
Начнем с написания HTML-кода меню. Это несложно и будет выглядеть примерно так:
Это обычное меню, составленное из графических элементов. Я опустил несущественные для понимания детали - такие как указание высоты и ширины изображения, тег ALT и т.п. Заметьте, однако, что для каждой картинки указан атрибут name, который понадобится для ссылки на картинку.
Теперь мы немного модифицируем меню, добавив в него вызов функций смены
изображения. Для отслеживания попадания курсора мышки на изображение мы воспользуемся событием onMouseOver и привяжем к нему вызов функции смены изображения:



Ваше мнение



CAPTCHA