[thelist] Logic problem with a JavaScript image toggle...

Chris George cgeorge at basecorp.com
Fri Nov 7 11:46:59 CST 2003


Hi again.

I've run into another problem with some JavaScript. I want to create a
"toggle" for a menu tree (basically, a vertical arrow that changes to a
horizontal arrow onclick, revealing a sub-menu). I have the rest of the
menu completed, but am having problems with the toggle.  Here is what I
have so far:

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--//
var flipBack = "";
var oldArrow = "";

function flip(curArrow) {

if (flipBack && (oldArrow != curArrow)) {
 	flipBack="";
}
alert("curArrow:"+curArrow+", oldArrow:"+oldArrow);
    if (document.images) 
		if (!flipBack) {
        	document.images['image'+curArrow].src =
'images/menuarrow_off.gif';			
			flipBack="1";
			oldArrow=curArrow;
		} else {
			document.images['image'+curArrow].src =
'images/menuarrow_on.gif';
			flipBack="";
		}
		alert("flipBack:"+flipBack);

}
//-->
</SCRIPT>

And then on the link is:
<a href="#" onclick="flip(1);return false;"><img
src="images/menuarrow_on.gif" name="image1"></a>
<a href="#" onclick="flip(2);return false;"><img
src="images/menuarrow_on.gif" name="image2"></a>

The thing is, it *almost* works. My weird code up at the top resetting
the flipback is due to a strange behavior when one button is clicked,
then you click another button and then go back to the first button,
nothing happens. But if you click the first button again, it manages to
reset what it needs to and works properly.

I know my logic is foggy at best... But other than creating a separate
function for each arrow, what is a solution?



More information about the thelist mailing list