Лабораторная работа № 2

Ролловер активируется исходя из изменений события мышки, рассмотрим 4 варианта активации:

• · onMouseOver Поведение активируется, когда указатель проходит над областью активации;
• · onMouseOut Поведение активируется, когда указатель выходит из области активации;
• · onClick Поведение активируется при щелчке объекта-активатора;
• · onLoad Поведение активируется при загрузке веб-страницы.

Создайте простой ролловер и примените на практике все случаи его активации.

Создание и присоединение раздельного ролловера Раздельный ролловер заменяет изображение web-объекта, когда указатель мыши перемещается над другим web-объектом. Если переместить указатель над изображением активатором или щелкнуть его, то в другой части веб-страницы появляется изображение. Изображение, над которым перемещается указатель, является активатором, а заменяемое изображение — целью. Необходимо предварительно настроить активатор, фрагменты-цели и кадр, в котором хранится замещающее изображение. Затем активатор можно связать с целевым фрагментом линией поведения. Активатор всегда является web-объектом (фрагмент, активная область или кнопка).

• 1. Создайте произвольный объект.
• 2. Создайте новый кадр на панели"States" (Состояния) путем нажатия кнопки «Duplicate State» (Дублировать состояние) (Рисунок 26).

Рисунок 26 — Создание нового кадра

• 3. Поместите второе изображение (цель) в новый кадр, но не под фрагмент, созданный на шаге 1.
• 4. Создайте второй фрагмент для второго изображения (Рисунок 28).
• 5. Вернитесь к первому изображению и перетащите маркер поведения первого фрагмента на второй фрагмент. Линия поведения пройдет из центра активатора в левый верхний угол целевого сегмента, а затем на экране появится диалоговое окно «Swap Image» (Замена изображения) (Рисунок 28).

Рисунок 27 — Создание второго фрагмента

Рисунок 28 — Диалоговое окно «Swap Image» (Замена изображения).

• 6. Во всплывающем меню «Swap Image» (Замена изображения) выберите кадр, созданный на шаге 2, и нажмите кнопку «ОК».
• 7. Выполните предварительный просмотр и тестирование раздельного ролловера клавишей «F12».