Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jun 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript collapsing menu - stay open Help

    I have some code that I have been working with that currently creates a javascript menu using a list item. This menu works fine and is collapsable. The problem I am having now is that, when ever I goto one of the links from it, the menu closes back to its original setup, instead of keeping the menu I just clicked from open. Here is my code:

    Code:
    <script type="text/javascript">
    <!--
    window.onload=show;
    function show(id) {
    var d = document.getElementById(id);
    	for (var i = 1; i<=10; i++) {
    		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
    	}
    if (d) {d.style.display='block';}
    }
    
    //-->
    </script>
    
    
    
    <dl id="menu">
    		
    
    
    
    		<dt onclick="javascript:show('smenu1');"><a href="#" onMouseOver="document.Image6.src='images/load-butt-rollover.gif';" onMouseOut="document.Image6.src='images/load-butt.gif';"><img src="images/load-butt.gif" name="Image6" width="197" border="0" id="Image6" /></a> 
    			</dt>
    			<dd id="smenu1">
    				<ul>        
    					<li><a href="1a.html">Steel Faced Laminated<br>钢面层压橡胶块防撞垫 </a></li>
    					<li><a href="1b.html">Laminated Rubber Dock Bumpers<br>层压橡胶防撞垫</a></li>
    					<li><a href="1c.htm">Molded Dock Bumper<br>压模橡胶防撞垫</a></li>
    					<li><a href="1d.html">Dock Accessories<br>装卸月台辅助配件</a></li>
    				</ul>
    			</dd>	
    			
    		<dt onclick="javascript:show();"><a href="wheel.html" onMouseOver="document.Image7.src='images/wheel-butt-rollover.gif';" onMouseOut="document.Image7.src='images/wheel-butt.gif';"><img src="images/wheel-butt.gif" name="Image7" width="197" border="0" id="Image7" /></a></dt>
    
    		<dt onclick="javascript:show('smenu3');"><a href="#" onMouseOver="document.Image8.src='images/Gurd-butt-roll.gif';" onMouseOut="document.Image8.src='images/Gurd-butt.gif';"><img src="images/Gurd-butt.gif" name="Image8" width="197"  border="0" id="Image8" /></a></dt>
    			<dd id="smenu3">
    				<ul>
    					<li><a href="guard.html">Overhead Door Track Protector<br>门框钢卫士</a></li>
    				</ul>
    			</dd>	
    </dl>
    There is some css to go along with it, but I don't think that is needed here. What kind of code can I add to make it so it remembers what was previously opened?

    any help would be greatly appreciated.

  • #2
    Senior Coder tomws's Avatar
    Join Date
    Nov 2007
    Location
    Arkansas
    Posts
    2,644
    Thanks
    29
    Thanked 330 Times in 326 Posts
    If you're actually going to another page from those links, there is no 'memory'. The page is built with the same menu, so it's closed just like it was on the referring page.

    If you want it to open a particular submenu on each page, you'll need to either use GET vars, for example, and pass along the menu state, or customize the menu on every page so that the menu state on that page reflects what you want.

  • #3
    New to the CF scene
    Join Date
    Jun 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Any idea on how I can modify the code to do it manually

  • #4
    Senior Coder tomws's Avatar
    Join Date
    Nov 2007
    Location
    Arkansas
    Posts
    2,644
    Thanks
    29
    Thanked 330 Times in 326 Posts
    Assuming the onclick event in the dt tag is what opens the menu, something like this might work:
    Code:
    <script type="text/javascript>
    
    var thisPageMenu = 'thisPageMenuName'; // customize this for every page, e.g. 'smenu3'
    window.onload = show(thisPageMenu);
    
    /* everything else ... */
    
    </script>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •