Setting Target for Top Level Menu Items in Switch Menu

[So_Cute]

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

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


Sure thing:

In your code, find the function SwitchMenu and replace it with this:


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:


<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!

[jscheuer1]

Well, here is where the the 'opening' and targeting currently take place:

if (addr) parent.location.href=addrThis 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:

if (addr) location.href=addrNow, we can target, let's change it to:

if (targ&&targ!=='_blank')
targ.location.href=addr
else if (targ&&targ=='_blank')
window.open(addr)
else if (addr) location.href=addrWe also need to allow for and pass the new 'targ' variable, so where it says:

function SwitchMenu(obj, addr){add to it like this:

function SwitchMenu(obj, addr, targ){Finally, when we call this use:

onclick="SwitchMenu(0, './test2.html', '_blank')"or:

onclick="SwitchMenu(0, './test2.html', 'main')"

[So_Cute]

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

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:


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:


<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":


<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!

[So_Cute]

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:


<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.

[jscheuer1]

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?

.

[So_Cute]

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.

[jscheuer1]

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:

targ.location.href=addrChange it to this:

window[targ].location.href=addrTested and works here in Mozilla (FF, NS) and IE.

[So_Cute]

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!