Can't get button to stick

[Lee David]

I have a page that has menu buttons on it. There are regular, over and down
images that I swap. The problem is I can't seem to get the buttons to
stick. So if I click the "News" image, that page comes up, but the button
returns to the "normal" image when I want it to keep the "down" image until
a different button is clicked. Here is some of the code:

function mousedown(source, img, area)
{
document[source].src = img;
document[area].src = "../images/menu/" + area + "menu_f3.gif";
}

"Source" is the secondary menu buttons on specific pages. "Area" is the
major menu buttons on all pages. This would be called on a page by this:

<script language="JavaScript" type="text/javascript">
mouseover('News', '../images/menu/Newsmenu_f2.gif', 'dummy');
</script>

<table width="100%" border="0" cellspacing="10" align="center">
<tr>
<td width="15%" valign="top">
<table width="100" border="0">
<tr>
<td>
<br>
<a href="news.php?contact=general">
<img src="../images/news/General.gif" name="newsgen"
onmouseover="mouseover('newsgen', '../images/news/General_f2.gif',
'News')"
onmousedown="mousedown('newsgen', '../images/news/General_f3.gif',
'News')"
onmouseout="mouseout('newsgen', '../images/news/General.gif',
'News')"
alt="General Info Button" title="General Info Button"
border="0"></a></td>
</tr>

The first javascript is to force the major button to "down" whenever the
page is loaded. What I see is while the submenu button is down, the major
one is down. When you leave the submenu button, the major one pops back to
the "normal" state. The major menu is located in an include that is
included on all pages.

Any ideas of what I'm doing wrong?
TIA, Dave

 

[Stephen Chalmers]

I have a page that has menu buttons on it. There are regular, over and down
images that I swap. The problem is I can't seem to get the buttons to
stick. So if I click the "News" image, that page comes up, but the button
returns to the "normal" image when I want it to keep the "down" image until
a different button is clicked.

<SNIP>

If I understand correctly, you want to disable the mouseout action for a given clicked button until another button in
the set is clicked.

Create a variable that stores a unique index relating to last button clicked:

var btnLock = -1;

Then for each button, use its onmousedown event to set the variable to that index:

onmousedown="btnLock=1; mousedown('newsgen', '../images/news/General_f3.gif', 'News')"

Then modify the mouseout function to take an extra parameter, which will be the index allocated to that button:

onmouseout="mouseout( 1, 'newsgen', '../images/news/General.gif', 'News')" alt="General Info Button"
title="General Info button" border="0"></a>

Then code the mouseout function to compare the index parameter passed to it with the current value of 'btnLock'.
If they are different, perform the specified swap, otherwise set a timeout (say 100mS) to call mouseout with its current
parameters. These calls will be repeated until the value of btnLock is changed by the clicking of a different button, at
which point the next timed call to mouseout will perform the swap back of the 'locked' button. (Not tested)