Введение в JavaScript

       

Обработка событий Mouseover и Mouseout


Эти два события из всех событий, которые обрабатываются на страницах Web, используются чаще всего. Именно они позволяют обесцвечивать и проявлять картинки, а также менять содержание поля status. Первое событие генерируется браузером, если курсор мыши указывает на гипертекстовую ссылку, а второе — когда он покидает гипертекстовую ссылку. Рассмотрим пример с записной книжкой, но только для проявления меню второго уровня будем использовать обработчик события onMouseover:

<table CELLSPACING=1 CELLPADDING=0 ALIGN=center> <TR> <TD> <A HREF="javascript:void(0);" onMouseover="line2(0);return true;"> <IMG SRC=addrpho.gif BORDER=0></A></TD> ... </TR> </TABLE>

В качестве обработчика события мы вызываем функцию line2(), которая идентична line1() из предыдущего примера. В примере IMG перенесен на новую строку для наглядности. На самом деле так поступать не следует — при интерпретации HTML-парсером могут появиться неучтенные пропуски, которые не предусмотрены автором страницы. (открыть)


Рис. 17.2. 

Мы рассмотрели редкий пример, в котором не требуется возврата предыдущего значения после прохода мыши по гипертекстовой ссылке. По этой причине в гипертекстовой ссылке не применялся второй обработчик onMouseout. В большинстве случаев, например при расцвечивании картинки, он требуется:

<A HREF="javascript:void(0);" onMouseover="document.pic1.src='image2.gif'; return true;" onMouseout="document.pic1.src='image.gif'; return true;"> <IMG NAME=pic1 src=image.gif BORDER=0></A>

Рассматривая предыдущий пример, мы не обсудили использование функции return. При работе с графикой значение, которое возвращает обработчик события, на результат отображения не влияет. Но если изменять значение поля статуса браузера, то изменения произойдут только в случае возврата значения true. Более подробно об этом рассказано в разделе "Поле статуса".



Содержание раздела