Бегающий указатель
Чем отличаются варианты RollOver с "подсвечиванием пунктов меню" и "бегающим указателем"? Только тем, что во втором случае у нас есть всего две картинки, используемые для всех пунктов меню - пустая и с изображением указателя. Пример использования данного эффекта, можно посмотреть вот здесь
В этом варианте RollOver нам придется слегка изменить HTML-код, описывающий меню, т.к. перед каждым пунктом меню мы добавляем изображение пустого указателя:
<img src="pic/pointer.gif" name="pic1"><a href="news.htm" onmouseover="over('pic1');" onmouseout="out('pic1');"><img src="pic/pic-1.gif"></a>
Обратите внимание на несколько особенностей. Во-первых, вместо одной функции смены изображения нам понадобятся две, т.к. действия, производимые при попадании курсора в область пункта меню, и покидании ее слегка отличаются. Мы назовем эти функции соответственно over() и out(). Во-вторых, заметьте, что атрибут name, тега <img>, переместился из описания пункта меню в описание указателя - ведь теперь мы подсвечиваем не меню, а указатель!
Число параметров, передаваемых функциям можно сократить - достаточно ограничиться именем картинки (атрибут name), т.к. ссылки на изображения, формирующие указатель, нам известны заранее. Код, осуществляющий необходимые действия, теперь выглядит так:
function over(img) { if (browser_ok == 'true') { document.images[img].src = "pic/pointer-on.gif"; } } function out(img) { if (browser_ok == 'true') { document.images[img].src = "pic/pointer.gif"; } }
Осталось разобраться с отличиями, которые присущи третьему варианту эффекта, а именно...
