Javascript rollovers, want to keep rollover image onClick

JavaScript
1

I would like the menu I created with javascript to keep the rollover image when it is clicked. Is there some sort of onClick code I can add to accomplish this? Here one of the menu items code:


  <a href="x"  onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images/bever_ro.jpg',1) "target="examples"><img src="images/bever.jpg" alt="Westover - Bever Health & Welness" name="Image5" width="160" height="45" border="0" id="Image5" /></a>

thanks

2

Hey.

I would probably do something like:

<a href="x" onclick="MM_swapImage('Image5','','images/bever_ro.jpg',1) "target="examples"><img src="images/bever.jpg" alt="Westover - Bever Health & Welness" name="Image5" width="160" height="45" border="0" id="Image5" /></a>

(omitting the onmouseover on onmouseout events.)

3

Is there a function that can still do both? I need it to have the rollover function and the onclick function. I tried to add the onclick code

<a href="x"  onclick="MM_swapImage('Image5','','images/bever_ro.jpg',1)" onmouseout="MM_swapImgRestore()" onclick="Image5','','images/bever_ro.jpg',1" onmouseover="MM_swapImage('Image5','','images/bever_ro.jpg',1)" target="examples"><img src="images/bever.jpg" alt="Westover - Bever Health &amp; Welness" name="Image5" width="160" height="45" border="0" id="Image5" /></a>

and keep the onmouseover on onmouseout events, but that did not work.

Seems like this would be something fairly common that people would use, but I can’t seem to find any information on how to do it.
thanks

4

You could remove the event handlers to prevent them from swapping the images anymore.


onclick="this.onmouseover=null;this.onmouseout=null;
5

Thanks for your input crmalibu.

I added that onclick code and yes, it sure does work, but too well. This is more complicated than I originally thought. Check out this webpage.
http://174.132.114.2/~meybro78/residential.html

The rollovers work fine, when you click one of the buttons the link stays “highlighted” just fine, but now try to click a second link. They both stay “highlighted”. Is there another code to add to tell it when something else is clicked to go back to onmouseout image?

thanks guys! I’m doing javascript tutorials this morning, but this is a little beyond the basics I see. :slight_smile:

6

So I’m still struggling to find a way to remove the onclick command once the user rollovers another link or clicks another link. I need it to go back to the onmouseover image. Is this possible?

<a href="Westover_Bever.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','images/bever_ro.jpg',1)" onclick="this.onmouseover=null;this.onmouseout=null;" target="examples"><img src="images/bever.jpg" alt="Bever" name="Image7" width="160" height="45" border="0" id="Image7" /></a><br />
7

bump

I would also like orange’s question to be answered as I have the same problem and situation except I can’t get it to highlight at all.