View Full Version : Disable onMouseOut when image is clicked

08-05-2002, 04:07 PM
I have an image rollover, and I want to disable the onMouseOut behavior if onClick is true (in other words, if the user clicks an image, when the mouse moves out it doesn't switch the highlighted button back to dim).
The page in question is here:
The client wanted all images to be on one page, so making multiple pages for each image, while it would solve the problem, isn't an option. Notice how when the buttons on the left are rolled over, they highlight, when rolled out, they dim. When one is clicked, it changes the image in the center; it should stay highlighted when the mouse rolls out.
I'm guessing there's an if/then statement that needs to be written, like "If the image is clicked, change all other images to the up state and don't do anything onMouseOut to the current image". Any suggestions as to how to write something like this?

Mr J
08-05-2002, 06:49 PM
Take a look on my site at


Select the link for [B]Text Links[B ]and look for:

Highlighted Link on

This might be the script you require.

08-05-2002, 10:06 PM
Just use a separate array to keep track of which images have been clicked, and check against that array whenever an onMouseOut() occurs...

08-05-2002, 10:08 PM
OK, listen up.....

Add this to the script:

function unhilite(exception) {
for (var i=1; i<9; ++i)
if (i != exception) chgImg('image' + i + 'preview','thumb' + i + 'u')

document.clicked = null;

Do the HTML like so:

<td align="center">
<a href="#" onClick="document.clicked=this;
unhilite(1);return false;"
<img name="image1preview" border="0" src="image1preview.jpg" width="45" height="45"></a></td>
<td align="center">
<a href="#" onClick="document.clicked=this;
unhilite(2);return false;"
<img name="image2preview" border="0" src="image2preview-light.jpg" width="45" height="45"></a></td>

...and so on. The document&#46;clicked property (custom) tracks the link that lit the current image; it's tested to see if the mouseout should run. return false; to cancel any side-effects of the link. Hope that works.

08-05-2002, 10:17 PM
Uhhh...wow. That sure looks complicated. I think a tracking array would be a bit easier. Oh, and can you please post your code within the vB Code 'CODE' tags?

08-05-2002, 10:19 PM
Pardon me but - who the heck are you? This isn't your website, and some of us have been here a bit longer than you.

Scratch that - all of us have been here longer. :rolleyes:

08-05-2002, 10:28 PM
Wow. I thought I made a plain comment and asked a simple question. I even said 'please' (besides, what's wrong with a little controversy?)

I've been on/visited MANY different web development forums and it always seems typical and proper (and many times expected by the MODs) to post large amounts of code into the proper 'CODE' tags. Just FYI.

Also...the number of posts I have made at this particular forum (or any for that matter) gives you ZERO insight to my knowledge or experience. Certainly you don't think your 178 posts here gives you some sort of intangible seniority over me or anyone else's post content and the right to be rude, do you?

Look, apologies all around for misread intentions. Lighten up. It's really not that bad.

08-06-2002, 03:01 AM
Thanks, I'm going to give it a whirl...
FWIW, this has been an excellent first-post experience in a new community, what with both valuable info and squabbling rolled into one thread. I'm stoked!

08-06-2002, 03:22 AM
Adios-you rock!!!!! Take a look now, the code you gave me does the trick. Thanks, I owe you...

07-25-2005, 04:12 PM

Sorry for restarting a old thread but I really need help on this script.
I was wondering if u could help me to possibly edit the script so I can have a image for the initial state, onmouseover and when clicked. Also is it possible to select a image initially when the page is loaded?

Thanks for any help!!


07-26-2005, 07:56 PM
hi again

please can some1 help me on this as its the only script I have found which is similiar to what i need!!

thanks, any help appreciated