#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2004
    Posts
    101
    Rep Power
    15

    Show selected menu with hierarchy on each Page. Drop Down Menu Help needed......


    Following sample is from http://www.code-couch.com/jeff/snippets/general/tektips-navigation-example.html
    is what I am trying to reference to create a template. But how do I how keep the state of Menu on each requested page any help is appreciated. The following menu is saved in a separate jsp file i.e. navs.jsp. I include this navigation jsp file in all of my files. Initially the drop down looks like:


    Code:
    . Ask.Jeeves 
    . [+] Google.com 
    . [+] Yahoo.com
    Now clicking [+] in front of Google.com will look like.

    Code:
    . Ask.Jeeves 
    . [-] Google.com 
         . Google.co.ie
         . Google.co.ie
         . [+] Google.co.nz 
    . [+] Yahoo.com
    Lets's say now if I click on Google.co.ie it takes me to sample.jsp and on this requested page (sample.jsp) how can I show the following menu hierarchy with Google.co.ie bold/underlined/colorchanged showing what menu content I clicked and am viewing the appropriate content i.e.


    Code:
    . Ask.Jeeves 
    . [-] Google.com 
         . Google.co.ie
         . Google.co.ie
         . [+] Google.co.nz 
    . [+] Yahoo.com
    Same way clicking Google.com or Yahoo.com or Ask.Jeeves shows you the following hierarchy on the requested page with higlight/bold/colored the link we just selected. i.e.


    Code:
    . Ask.Jeeves 
    . [+] Google.com 
    . [+] Yahoo.com
    Any time clicking on the menu takes me to some page but on that page I want to show th hierarchy of the menu all the way to which is recently clicked with different color setting.

    Here is the source for the above:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
    <meta http-equiv="content-language" content="en"/>
    <title>Test Harness</title>
    
    <style type="text/css">
    
    ul li ul {display:none;list-style-type: none;}
    
    #myNav li a:hover {
    color: blue;
    }
    
    #myNav li a:active {
    color: #FF0000;
    background: #FFFFFF;
    }
    
    #myNav { list-style-image: url(page.GIF); }
    </style>
    
    <script type="text/javascript">
    <!--
    function initNav() {
    	var navObj = document.getElementById('myNav');
    	var ulCollection = navObj.getElementsByTagName('li');
    	for (var loop = 0; loop < ulCollection.length; loop++) {
    		if(ulCollection[loop].getElementsByTagName('ul').length > 0) {
    			/* we have an LI that contains a UL */
    			if (ulCollection[loop].getElementsByTagName('span').length > 0) {
    				/* there is at least one SPAN tag present */
    				ulCollection[loop].getElementsByTagName('span')[0].innerHTML = "[<a href=\"javascript://\" onclick=\"this.innerHTML=this.innerHTML=='+'?'-':'+';temp=this.parentNode.parentNode.getElementsByTagName('ul')[0].style;temp.display=temp.display=='block'?'none':'block';\">+</a>] ";
    			}
    		}
    	}
    }
    window.onload = initNav;
    //-->
    </script>
    
    </head>
    <body>
    <ul id="myNav">
    	<li><a href="http://www.askjeeves.com">Ask.Jeeves</a></li>
    	<li><span></span><a href="http://www.google.com">Google.com</a>
    		<ul>
    			<li><a href="http://www.google.co.uk">Google.co.uk</a></li>
    			<li><a href="http://www.google.co.ie">Google.co.ie</a></li>
    			<li><span></span><a href="http://www.google.co.nz">Google.co.nz</a>
    			<ul>
    			   <li>*3*</li>
    			   <li>*4*</li>
    			</ul>
    </li>
    		</ul>
    	</li>
    
    	<li><span></span><a href="http://www.yahoo.com">Yahoo.com</a>
    		<ul>
    			<li><a href="http://www.yahoo.co.uk">Yahoo.co.uk</a></li>
    			<li><a href="http://www.yahoo.co.nz">Yahoo.co.nz</a></li>
    		</ul>
    	</li>
    </ul>
    </body>
    </html>
    Any help is really appreciated thanks.
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Extra-forum cross-post

    Please don't be offended by this -- I just wish to make a point.

    No point in someone else giving the same answer that I already gave.

    You see, I don't want other people wasting their time answering a question that was already answered somewhere else.

    I just don't see why posting the same question in multiple forums with just a few minutes between is necessary. Sure if you don't get a useful response at one forum... It just seems selfish to me.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo