Событие onmouseout в Javascript

Итак, у меня есть навигация с 3 кругами и ползунок jquery.

По умолчанию загорается первый кружок, а когда пользователь нажимает на второй круг, ползунок перемещается ко второму div, затем этот круг загорается, а первый кружок тускнеет. Это работает так же с 3-м кругом.

Все работает нормально, вот так выглядит код

<img name="bullet1" height="30px" width="30px" src="img/bulletwhite.png" onmousedown="this.src='img/bulletwhite.png';document.images['bullet2'].src='img/bullet.png';document.images['bullet3'].src='img/bullet.png'" style="opacity:0.4;filter:alpha(opacity=40)"/>
<img name="bullet2" height="30px" width="30px" src="img/bullet.png" onmousedown=" this.src='img/bulletwhite.png';document.images['bullet1'].src='img/bullet.png';document.images['bullet3'].src='img/bullet.png'" style="opacity:0.4;filter:alpha(opacity=40)"/>
<img name="bullet3" height="30px" width="30px" src="img/bullet.png" onmousedown=" this.src='img/bulletwhite.png';document.images['bullet1'].src='img/bullet.png';document.images['bullet2'].src='img/bullet.png'" style="opacity:0.4;filter:alpha(opacity=40)"/>

Моя следующая задача — добавить эффект наведения к кругам, однако, когда я даю ему эффект наведения, он меняет src изображения, верно? поэтому, когда срабатывает onmouseout, чтобы изменить его обратно, это всегда будет тусклый круг, даже если круг ранее был освещен.

Итак, мой основной вопрос заключается в следующем: есть ли способ запомнить src изображения ДО того, как onmouseover изменит его, а затем использовать его, чтобы вернуть его в предыдущее состояние при срабатывании onmouseout, я надеюсь, что это имеет смысл :)

Любой совет поможет!


javascript onmouseout
person Doug Molineux    schedule 03.06.2010    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Вы можете попробовать добавить настраиваемый атрибут для расширения класса или создать свой собственный объект JavaScript, в котором будут храниться текущие и целевые изображения (или базовые, активные и наведенные), а затем связать их с основным скриптом. Вероятно, ваша логика значительно упростилась бы, если бы вы исключили JS из локальных событий и перехватывали события с помощью библиотеки типа prototype. js или jquery (хотя это излишество - может быть полезно в другом месте!)

person AJ.    schedule 03.06.2010
comment
хорошо, спасибо за ваш вклад, я думаю, что могу попробовать просто добавить какой-нибудь атрибут css, чтобы, по крайней мере, дать кругу границу или, возможно, даже изменить его фоновое изображение, - person Doug Molineux; 04.06.2010
comment
Если кому-то интересно, как я это сделал, я использовал функцию jquery hover и в основном создал div поверх кругов, спрятал div в document.ready, а затем показал их при наведении и снова скрыл при наведении мыши. - person Doug Molineux; 04.06.2010