Results 1 to 8 of 8

Thread: Setting Target for Top Level Menu Items in Switch Menu

  1. #1
    Join Date
    Jan 2005
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Setting Target for Top Level Menu Items in Switch Menu

    http://www.dynamicdrive.com/dynamici...switchmenu.htm

    I found a modification of the Script Menu which allows you to have top level items in the menu.

    Quote Originally Posted by Minos
    Sure thing:

    In your code, find the function SwitchMenu and replace it with this:
    Code:
    function SwitchMenu(obj, addr){
    	if(document.getElementById){
    	if (obj!=0)var el = document.getElementById(obj);
    	var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
    		if(obj==0 || el.style.display != "block"){ //DynamicDrive.com change
    			for (var i=0; i<ar.length; i++){
    				if (ar[i].className=="submenu") //DynamicDrive.com change
    				ar[i].style.display = "none";
    			}
    			if (obj!=0)el.style.display = "block";
    		}else{
    			if (obj!=0)el.style.display = "none";
    		}
    	}
            if (addr) parent.location.href=addr
    }
    Then, for your menu, it should look like this:
    Code:
    <div class="menutitle" onclick="SwitchMenu(0, './test2.html')" onMouseOver="this.className='menutitle2'" onMouseOut="this.className='menutitle'">Home</div>
    
    	<div class="menutitle" onclick="SwitchMenu('sub2')" onMouseOver="this.className='menutitle2'" onMouseOut="this.className='menutitle'">Industrial</div>
    	<span class="submenu" id="sub2">
    		<a href="http://www.sequal.com/industrialoxygenproducts.htm" target="mainWindow">Oxygen</a><br>
    		<a href="http://www.sequal.com/industrialnitrogengproducts.htm" target="mainWindow">Nitrogen</a><br>
    		<a href="http://www.sequal.com/industrialairdryingproducts.htm" target="mainWindow">Air Dryer</a><br>
    	</span>
    For the ones that will not expand, the onClick becomes SwitchMenu(0, 'theurlitislinkedto.html'). That's it! The onMouseover and onMouseOut are just a way to have (obviously) mouseover effects.
    The modification works great and does just what I wanted, except that I don't know how to set the target for a top level link. Some top level items will need to open in an iframe on the same page (target="main") and some will need to open in a new window (target="_blank").

    Can someone help me please? I'm a total dork when it comes to Javascript!

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,957
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    Well, here is where the the 'opening' and targeting currently take place:
    Code:
    if (addr) parent.location.href=addr
    This will actually open the the link in the parent window (if using frames and the script is in a frame, this means the top level frameset will be replaced - if there is no frameset, it just means the current window. It really should read just:
    Code:
    if (addr) location.href=addr
    Now, we can target, let's change it to:
    Code:
    if (targ&&targ!=='_blank') 
    targ.location.href=addr
    else if (targ&&targ=='_blank')
    window.open(addr)
    else if (addr) location.href=addr
    We also need to allow for and pass the new 'targ' variable, so where it says:
    Code:
    function SwitchMenu(obj, addr){
    add to it like this:
    Code:
    function SwitchMenu(obj, addr, targ){
    Finally, when we call this use:
    Code:
    onclick="SwitchMenu(0, './test2.html', '_blank')"
    or:
    Code:
    onclick="SwitchMenu(0, './test2.html', 'main')"
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jan 2005
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thank you so much for your help! I wasn't far off in what I was trying to do!

    The top level links that need to open in a new window are working, but the one that needs to open in an iframe doesn't.

    Here's my code:

    Code:
    function SwitchMenu(obj, addr, targ){
    	if(document.getElementById){
    	if (obj!=0)var el = document.getElementById(obj);
    	var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
    		if(obj==0 || el.style.display != "block"){ //DynamicDrive.com change
    			for (var i=0; i<ar.length; i++){
    				if (ar[i].className=="submenu") //DynamicDrive.com change
    				ar[i].style.display = "none";
    			}
    			if (obj!=0)el.style.display = "block";
    		}else{
    			if (obj!=0)el.style.display = "none";
    		}
    	}
            if (targ&&targ!=='_blank') 
    		targ.location.href=addr
    		else if (targ&&targ=='_blank')
    		window.open(addr)
    		else if (addr) location.href=addr
    }
    Link for new window:

    Code:
    <div class="menutitle2" onclick="SwitchMenu(0, 'http://www.mysite.com/', '_blank')" onMouseOver="this.className='menutitle'" onMouseOut="this.className='menutitle2'">Sports Center</div>

    Link for Iframe "Main":

    Code:
    <div class="menutitle2" onclick="SwitchMenu(0, 'awards.php', 'main')" onMouseOver="this.className='menutitle'" onMouseOut="this.className='menutitle2'">Awards</div>
    The onclick for the iframe links seems to have a problem. The onMouseOver and onMouseOut work fine.

    We're halfway there!

  4. #4
    Join Date
    Jan 2005
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    A little more testing......

    I added another top level link that I want to open in the same window (target="_top"). It doesn't work either.

    Here's the link:

    Code:
    <div class="menutitle2" onclick="SwitchMenu(0, 'index.php', '_top')" onMouseOver="this.className='menutitle'" onMouseOut="this.className='menutitle2'">Home</div>
    If I change the onclick target to _blank, it works.

  5. #5
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,957
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    It should work. To open in the same window, do not specify any target. One problem could be, are you using frames? I mean is the page with the script on it in a frame or iframe?

    PLEASE: Include the URL to your problematic webpage that you want help with.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #6
    Join Date
    Jan 2005
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    To open in the same window, do not specify any target.
    Duhhhhh.. I knew that. I've been messing with this too long I think.

    The only thing not working now is the link to open in an iframe. There are no frames on the page. The navigation menu is in a PHP include pulled into the main page and the target is an iframe in the same page.

    Here's the link:

    http://www.goldingmultimedia.com/mlp/index.php

    The link that isn't working is the Awards link (last one in the navigation menu).

    Thanks John for your assistance. It would have taken me weeks to get even this far without you.

  7. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,957
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    There is another problem but, there is no:

    http://www.goldingmultimedia.com/mlp/awards.php

    page. Unless there is some kind of php code that makes one, you need to make one. The other problem is that the syntax I used just won't work, I'm not sure why but, I've seen this happen before and know what will work. So where we had:
    Code:
    targ.location.href=addr
    Change it to this:
    Code:
    window[targ].location.href=addr
    Tested and works here in Mozilla (FF, NS) and IE.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. #8
    Join Date
    Jan 2005
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    BINGO!!!! We have a winner!

    And you were right. I hadn't made an Awards page yet. It's still on the to-do list, but there's a temporary page up now.

    Everything is now working exactly the way I wanted. John, thank you for all of your help. It's much appreciated here!

Bookmarks

Posting Permissions

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