Javascript Expand Menu Question

[wblakenc]

Hello all,
I have run into an issue with an JavaScript expand menu (you click a menu option a sub-menu shows, moving the other main navigation menu options down).

Well I have designed a nice custom script to do just this. The problem is, how do I keep that sub-menu shown when the user clicks a link and the page refreshes. Basically I need a way to check to see if the menu has been opened before, and if so, keep it open on the new page. How does one do this? URL variable? Setting some sort of cookie? I know if I were doing something like this in ColdFusion I would just set a session, or other variable that persists page after page, but JavaScript has no such function?

Any Idea?

Thanks for any and all help!

Will

[wblakenc]

Just to make it clear here is the code for what the user clicks on a menu option a sub menu shows up with the following options.

<div id="rampsMenu">
        <a href="javascript:;" onclick="expand_ramps()"><img src="cw3/assets/images/leftNav/Ramps.jpg" border="0" /></a><br />
        <a href="javascript:;"><img src="cw3/assets/images/leftNav/ThresholdRamps.jpg" border="0" /></a><br />
        <img src="cw3/assets/images/leftNav/SuitcaseRamps.jpg" border="0" /><br />
        <img src="cw3/assets/images/leftNav/SingleFoldRamps.jpg" border="0" /><br />
        <img src="cw3/assets/images/leftNav/MultiFoldRamps.jpg" border="0" /><br />
        <img src="cw3/assets/images/leftNav/PanelRamps.jpg" border="0" /><br />
        <img src="cw3/assets/images/leftNav/PathwayRamps.jpg" border="0" /><br />
        <img src="cw3/assets/images/leftNav/CurbCutRamps.jpg" border="0" /><br />
        <img src="cw3/assets/images/leftNav/ShowAllRamps.jpg" border="0" /><br />
    </div>

The first link makes the sub menu show up, and the first link on that menu (Threshold Ramps) is currently liked to nothing (i.e. javascript: ; ).

Here is the JavaScript I am using to make this happen.

function expand_ramps(value) {	
	/* check to see if menu is already open */
	if (this.RampsOpen == 'Yes') {
		document.getElementById("rampsMenu").style.height = "20px";		
		this.RampsOpen = 'No';
	/* if the menu is currently not open, send it to drawInfo to perform the draw down effect */	
	} else {		
		var res = document.getElementById("rampsMenu");
		/* element, goal size, starting size */
		drawInfo(res,160,10);
		this.RampsOpen = 'Yes';		
	}
}

function reset_all() {
	document.getElementById("rampsMenu").style.height = "20px";		
}

function drawInfo(element, goal, start) {
	var GoalPt = goal;	
	element.style.height = (start)+"px";	
	element.style.clip="rect(0px, 222px, "+start+"px"+", 0px)";		
	var newvalue = start + 10;
	var repeat = function () {		
		drawInfo(element,GoalPt,newvalue)
	};
	if (newvalue >= GoalPt) {
		return;
	} else {
	element.info = setTimeout(repeat,1);
	}
}