PDA

View Full Version : Open menu link in new window?



Naild
03-13-2005, 10:46 PM
This was in the Dynamic Drive section, but it sure looks like JavaScript to me. Can someone please tell me how to open the menu links in a new window? I sure would appreciate it. And yes, I know this is a stupid question, but I'm new to scripting. Thank you.


<SCRIPT Language="Javascript1.2">
<!--

/*
Static menu script (By maXimus, maximus@nsimail.com, http://absolutegb.com/maximus/)
Modified slightly/ permission granted to Dynamic Drive to feature script in archive
For full source, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/

//configure below variable for menu width, position on page
var menuwidth=110
var offsetleft=10
var offsettop=90

var ns4=document.layers?1:0
var ie4=document.all?1:0
var ns6=document.getElementById&&!document.all?1:0

function makeStatic() {
if (ie4) {object1.style.pixelTop=document.body.scrollTop+offsettop}
else if (ns6) {document.getElementById("object1").style.top=window.pageYOffset+offsettop}
else if (ns4) {eval(document.object1.top=eval(window.pageYOffset+offsettop));}
setTimeout("makeStatic()",0);
}

if (ie4||ns6) {document.write('<span ALIGN="CENTER" ID="object1" STYLE="Position:absolute; Top:20; Left:'+offsetleft+'; Z-Index:5;cursor:hand;background-color:black;"><TABLE BORDER="1" width="'+menuwidth+'" CELLPADDING="0" CELLSPACING="0" BORDERCOLOR="black" bgcolor="white">')}
else if (ns4){ document.write('<LAYER top="20" name="object1" left="'+offsetleft+'" BGCOLOR=black><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="1"><TR><TD><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" width="'+menuwidth+'">')}

if (ie4||ns6||ns4)
document.write('<TR><TD BGCOLOR="#3399FF" BORDERCOLORDARK="#99CCFF" BORDERCOLORLIGHT="#003399"><P ALIGN=CENTER><FONT SIZE="4" FACE=ARIAL>Menu</FONT></TD></TR>')

var menui = new Array();
var menul = new Array();

//configure below for menu items. Extend list as desired

menui[0]="Dynamic Drive";
menui[1]="What\'s New?";
menui[2]="What\'s Hot?";
menui[3]="Message Forum";
menui[4]="FAQs";
menui[5]="Submit Script";
menui[6]="Link to us";
menui[7]="Email us";

menul[0]="http://dynamicdrive.com";
menul[1]="http://dynamicdrive.com/new.htm";
menul[2]="http://dynamicdrive.com/hot.htm";
menul[3]="http://wsabstract.com/cgi-bin/Ultimate.cgi";
menul[4]="http://dynamicdrive.com/faqs.htm";
menul[5]="http://dynamicdrive.com/submit.htm";
menul[6]="http://dynamicdrive.com/link.htm";
menul[7]="http://dynamicdrive.com/contact.htm";

for (i=0;i<=menui.length-1;i++)
if (ie4||ns6) {document.write('<TR><TD BORDERCOLOR="white" ONCLICK="location=\''+menul[i]+'\'" onmouseover="className=\'menuh\'" onMouseout="className=\'menu\'"><CENTER><FONT>'+menui[i]+'</FONT></TD></TR>')}
else if (ns4){document.write('<TR><TD BGCOLOR="white"><ILAYER><LAYER width="'+menuwidth+'" onmouseover="bgColor=\'yellow\'" onmouseout="bgColor=\'white\'"><CENTER><A HREF="'+menul[i]+'" class=menulinks>'+menui[i]+'</A></CENTER></LAYER></ILAYER></TD></TR>')}

if (ie4||ns6) {document.write('</TABLE></span>')}
else if (ns4){document.write('</TABLE></TD></TR></TABLE></LAYER>')}

function menu3(){
if (ns6||ie4||ns4)
makeStatic()
}

window.onload=menu3

//-->
</SCRIPT>

jscheuer1
03-14-2005, 06:51 AM
The basic syntax for a new window is:

HTML:

<a href="somepathorurlifneeded/page.html" target="_blank">
and lucky you, the quotes are all optional (makes it much easier to slip inside of code that way).

JavaScript:

onClick=window.open('somepathorurlifneeded/page.html')

Since I see in your script that both HTML and JavaScript are used to open the links (depending upon the browser it seems) you will need to use both.

where it has:

<A HREF="'+menul[i]+'" class=menulinks>
make that:

<A HREF="'+menul[i]+'" target=_blank class=menulinks>

and where it has:

ONCLICK="location=\''+menul[i]+'\'
make that:

ONCLICK="window.open(\''+menul[i]+'\')

This will make all the menu links new windows. If you want to pick and choose which to do what with that will be a little harder given this script's way of handling the link event two different ways depending upon browser. It could be done with a flag and testing for the flag or with an almost duplicate link array (one for the HTML links, one for the JavaScript ones) but one of the below scripts might do the trick for you without modifying your menu at all:

http://dynamicdrive.com/dynamicindex8/newwindow.htm
http://dynamicdrive.com/dynamicindex8/newwindow2.htm
http://dynamicdrive.com/dynamicindex8/newwindow3.htm

Or, you could pick a different menu script that uses only one method to open links for all browsers.

jscheuer1
03-14-2005, 10:30 AM
I got bored, so I went ahead and modded this menu so it can optionally open in new or same window. Changes are highlighted orange (except for the new array, only the code for new window is highlighted there) and documented with comments:


/*
Static menu script (By maXimus, maximus@nsimail.com, http://absolutegb.com/maximus/)
Modified slightly/ permission granted to Dynamic Drive to feature script in archive
For full source, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/

//configure below variable for menu width, position on page
var menuwidth=110
var offsetleft=10
var offsettop=90

var ns4=document.layers?1:0
var ie4=document.all?1:0
var ns6=document.getElementById&&!document.all?1:0

function makeStatic() {
if (ie4) {object1.style.pixelTop=document.body.scrollTop+offsettop}
else if (ns6) {document.getElementById("object1").style.top=window.pageYOffset+offsettop}
else if (ns4) {eval(document.object1.top=eval(window.pageYOffset+offsettop));}
setTimeout("makeStatic()",0);
}

if (ie4||ns6) {document.write('<span ALIGN="CENTER" ID="object1" STYLE="Position:absolute; Top:20; Left:'+offsetleft+'; Z-Index:5;cursor:hand;background-color:black;"><TABLE BORDER="1" width="'+menuwidth+'" CELLPADDING="0" CELLSPACING="0" BORDERCOLOR="black" bgcolor="white">')}
else if (ns4){ document.write('<LAYER top="20" name="object1" left="'+offsetleft+'" BGCOLOR=black><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="1"><TR><TD><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" width="'+menuwidth+'">')}

if (ie4||ns6||ns4)
document.write('<TR><TD BGCOLOR="#3399FF" BORDERCOLORDARK="#99CCFF" BORDERCOLORLIGHT="#003399"><P ALIGN=CENTER><FONT SIZE="4" FACE=ARIAL>Menu</FONT></TD></TR>')

var menui = new Array();
var menul = new Array();
var menun = new Array(); //declare new array for ns4

//configure below for menu items. Extend list as desired

menui[0]="Dynamic Drive";
menui[1]="What\'s New?";
menui[2]="What\'s Hot?";
menui[3]="Message Forum";
menui[4]="FAQs";
menui[5]="Submit Script";
menui[6]="Link to us";
menui[7]="Email us";

//old array now only for ie4+ and ns6+:
menul[0]="window.open('http://dynamicdrive.com')"; //opens in new window
menul[1]="location='http://dynamicdrive.com/new.htm'"; //opens in same window:
menul[2]="location='http://dynamicdrive.com/hot.htm'";
menul[3]="location='http://wsabstract.com/cgi-bin/Ultimate.cgi'";
menul[4]="window.open('http://dynamicdrive.com/faqs.htm')"; //opens in new window
menul[5]="location='http://dynamicdrive.com/submit.htm'"; //opens in same window:
menul[6]="location='http://dynamicdrive.com/link.htm'";
menul[7]="location='http://dynamicdrive.com/contact.htm'";

//new array for ns4:
menun[0]="http://dynamicdrive.com target=_blank"; //opens in new window
menun[1]="http://dynamicdrive.com/new.htm"; //opens in same window:
menun[2]="http://dynamicdrive.com/hot.htm";
menun[3]="http://wsabstract.com/cgi-bin/Ultimate.cgi";
menun[4]="http://dynamicdrive.com/faqs.htm target=_blank"; //opens in new window
menun[5]="http://dynamicdrive.com/submit.htm"; //opens in same window:
menun[6]="http://dynamicdrive.com/link.htm";
menun[7]="http://dynamicdrive.com/contact.htm";

for (i=0;i<=menui.length-1;i++)
if (ie4||ns6) {document.write('<TR><TD BORDERCOLOR="white" ONCLICK="'+menul[i]+'" onmouseover="className=\'menuh\'" onMouseout="className=\'menu\'"><CENTER><FONT>'+menui[i]+'</FONT></TD></TR>')} //ONCLICK statement modified
else if (ns4){document.write('<TR><TD BGCOLOR="white"><ILAYER><LAYER width="'+menuwidth+'" onmouseover="bgColor=\'yellow\'" onmouseout="bgColor=\'white\'"><CENTER><A HREF="'+menun[i]+'" class=menulinks>'+menui[i]+'</A></CENTER></LAYER></ILAYER></TD></TR>')} //menul[i] is now menun[i] in this line

if (ie4||ns6) {document.write('</TABLE></span>')}
else if (ns4){document.write('</TABLE></TD></TR></TABLE></LAYER>')}

function menu3(){
if (ns6||ie4||ns4)
makeStatic()
}

window.onload=menu3

jscheuer1
03-14-2005, 11:45 AM
Static Menu Update - works with 'target=_blank' (using it as a flag for ie4+ and ns6+ and as a literal for ns4) for new window. Fixed outdated style.

attached as statmenuf.zip

deena63
05-14-2013, 02:47 AM
I have used this Static Menu by Maximus for a while with great results. But now I was hoping to be able to split one menu off to the side to allow for two choices. Example: Our Team (view on Menu) when clicked, a small two part menu of Partners and associates appears to allow user to choose which page to navigate to. Can it be modified, or should I search for a new menu?:confused:

djr33
05-14-2013, 03:09 AM
This thread is 8 years old. Please post a new thread if you have a new question.

Follow this link, and pay attention to the proper posting format:
http://www.dynamicdrive.com/forums/newthread.php?do=newthread&f=2