Jump to content
xisto Community
Sign in to follow this  
lonebyrd

Help With Menu Using CSS

Recommended Posts

I've been trying to figure out this drop down kind of pop-out menu from http://alistapart.com/article/horizdropdowns I'm not exactly sure what it is I am doing wrong. On the site I've noted, it talks about CSS, and Javascript, and IE fixes, so I'm getting mighty confused. My main focus is to get the verticle drop down menu on my page, and everything else to be in line as well. But I can't even get the menu to show up. I've put the main part of the lists in a CSS file here:

 

menu.css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://forums.xisto.com/no_longer_exists/ xmlns="http://forums.xisto.com/no_longer_exists/ 
xhtml Menu</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><script type="text/javascript" src="drop_down.js"></script><style type="text/css">@import "menustyle.css";</style></head><body> <ul id="nav"><ul> 	<li><a href="#">Profile</a></li>	  <ul>		<li><a href="ftv.astahost.com/profile/person.php>Personal</a></li>		<li><a href="ftv.astahost.com/profile/studio.php>Studio</a></li>	  </ul>	</li>	<li><a href="#">Buy</a> 	  <ul> 		<li><a href="ftv.astahost.com/buy/studio.php">Studio</a></li> 		<li><a href="ftv.astahost.com/buy/sets.php">Sets</a></li> 		<li><a href="ftv.astahost.com/buy/ads.php">Advertisements</a></li> 	  </ul> 	</li> 	<li><a href="#">Hire</a> 	  <ul> 		<li><a href="ftv.astahost.com/hire/crew.php">Crew</a></li> 		<li><a href="ftv.astahost.com/hire/writers.php">Writers</a></li> 	  </ul> 	</li> </ul>
I'm not even sure if that is right. I looked at the source code on the demo page they had, and it had all that 'head, meta, title' stuff. But I didn't think that was supposed to be in CSS. But none-the-less it was there and it was working, so I didn't change it. Next I have the Javascript part:

 

drop_down.js

startList = function() {if (document.all&&document.getElementById) {navRoot = document.getElementById("nav");for (i=0; i<navRoot.childNodes.length; i++) {node = navRoot.childNodes[i];if (node.nodeName=="LI") {node.onmouseover=function() {this.className+=" over";  }  node.onmouseout=function() {  this.className=this.className.replace»	(" over", "");   }   }  } }}window.onload=startList;
That was copied 'as is' from the site. I know nothing of Javascript, so I was just trusting that they knew what they were doing. After that I had the style:

menustyle.css

<style type="text/css">ul {	margin: 0;	padding: 0;	list-style: none;	width: 150px;	border-bottom: 1px solid #ccc;	}ul li {	position: relative;	}li:hover ul, li.over ul { 	display: block; }li ul {	position: absolute;	left: 149px;	top: 0;	display: none;	}ul li a {	display: block;	text-decoration: none;	color: #777;	background: #fff;	padding: 5px;	border: 1px solid #ccc;	border-bottom: 0;	}/* Fix IE. Hide from IE Mac \*/* html ul li { float: left; }* html ul li a { height: 1%; }/* End */
This is where I did get a bit confused. In the directions on the site I went to, It made changes along the way. One of them was about adding the 'li:hover ul, li.over ul { display: block; }' and I wasn't really sure where to put that. Another thing I wasn't sure about was where to put the IE fix. I just put it at the bottom. And finally in the end, this is where it ended up in my main page:

 

main.php

<html><head><TITLE> Fantasized TeleVision</TITLE></head><body><LINK REL=stylesheet HREF="http://forums.xisto.com/no_longer_exists/; TYPE="text/css"><LINK REL="stylesheet HREF="ftv.astahost.com/menu.css" TYPE="text/css"><div id="banner"></div><center><font color=red size=12>Fantasized TeleVision</font> </center><h3><align="left"><font color=red><b>Site Under Construction</b></font></align></h3><center><b><a href="http://ftv.astahost.com/forum/" target=_"new">Visit the FTV Forum</a></b></center><p align="right"><b>Edge City</b></align><br>   <?php   $today = date("F j, Y, g:i");   echo $today   ?></body></html>

If anyone can see why the menu isn't working, please let me know. It's probably very simple. It usually is when I can't figure it out.

Share this post


Link to post
Share on other sites

AListApart is one awesome site for CSS. That's one of the sites which every CSS guru recommends for lots of stuff.

 

Here's a layout that I made using the 'Suckerfish Dropdown menus' from AListApart:

 

http://forums.xisto.com/no_longer_exists/

http://forums.xisto.com/no_longer_exists/mystyle.css

http://forums.xisto.com/no_longer_exists/iefix.js

 

The IE fix should be copied into a separate file called (as in your case) drop_down.js. What this fix does is, it simulates the :hover attribute for list elements for IE. IE doesn't support :hover for any element other than hyperlink (i.e. a:hover). The fix is then included in your header using a <script> tag.

 

Then to make the appearance the same in both firefox and IE, the code:

 

/* Fix IE. Hide from IE Mac \*/* html ul li { float: left; }* html ul li a { height: 1%; }/* End */

should be placed at the beginning of the CSS file menustyle.css (as in your case).

 

CSS menus take a little time to get used to, but they're not that difficult. I was as confused as you are when I started out with it, but just hang in there :unsure:.

Share this post


Link to post
Share on other sites

For some reason, everything I try doesnt seem to work. I follow it exact and still.... nothing. One thing I was wondering though. Do you have to have something special on you computer to do Javascript. I cant open that iefix.js file on this computer because it says I don't have a program to open it. Is this maybe the problem why nothing is showing up when I type out my scripts?

Share this post


Link to post
Share on other sites

I think I may know what the problem is. I had a background for my site was a picture hosted at photobucket. THe time expired for it to be there, so I no longer have a background. What I am thinking is that the menu needs the anchor of the background, and since I don't have a background at the moment, the menu will not show up. I don't have time right now to check out my theory. I can't make a background on the computer I'm using (my roomate doesn't have Photoshop) and I have no time to seach for a background now either. Hopefully putting up a background will solve my problem.

Share this post


Link to post
Share on other sites

Okay, I've been having a look at your code and playing about with it, and I've got it working now. But there are several things that need fixing. I'll try to make it all as clear as possible.

 

First of all:

I've put the main part of the lists in a CSS file here:

 

menu.css

I'm not even sure if that is right.  I looked at the source code on the demo page they had, and it had all that 'head, meta, title' stuff.  But I didn't think that was supposed to be in CSS.  But none-the-less it was there and it was working, so I didn't change it.[/quote]You're quite right, HTML doesn't go in CSS files. That code is actually the code for the page itself, not part of a CSS file. Since you have your own pages that you want to use the menu on, you don't need the html/head/body part. Just copy the part from the first "<ul>" to the last "</ul>" and paste it into your own page, wherever you want the menu to go.See where it says "<ul id="nav"><ul>"? That second <ul> is totally unnecessary, and it's messing up the rest of the page. Delete it.You aren't finished with menu.css yet, though! Find the line that says, "<script type="text/javascript" src="drop_down.js"></script>" and copy that to main.php. It should go in the head section, not the body of the file.Now have another look at main.php. See your two <link> tags? They should be in the head section, not the body section. (They will probably still work in the body, because browsers are good at figuring out poorly written HTML - nevertheless, it's against the rules of HTML and could cause problems with your page.) The second one has a problem. Notice the REL=stylesheet? It's got a quotation mark at the start of "stylesheet", but not at the end. Add one at the end as well.We've moved all the important code from "menu.css", so we aren't using that any more. You can delete it now. Change the HREF in the second LINK from "menu.css" to "menustyle.css", so that it links to our real stylesheet. And don't forget to put in "http://" at the start of "ftv.astahost.com/menustyle.css" - otherwise, the server will look for menustyle.css in a folder called ftv.astahost.com, instead of looking for it at your website.And now your menu should work! In case that wasn't very clear, here is the revised code of your "main.php" file:[code]<html><head><TITLE> Fantasized TeleVision</TITLE><LINK REL=stylesheet HREF="http://forums.xisto.com/no_longer_exists/; TYPE="text/css"><LINK REL="stylesheet" HREF="menustyle.css" TYPE="text/css"><script type="text/javascript" src="drop_down.js"></script></head><body><ul id="nav">	<li><a href="#">Profile</a></li>	  <ul>		<li><a href="ftv.astahost.com/profile/person.php>Personal</a></li>		<li><a href="ftv.astahost.com/profile/studio.php>Studio</a></li>	  </ul>	</li>	<li><a href="#">Buy</a> 	  <ul> 		<li><a href="ftv.astahost.com/buy/studio.php">Studio</a></li> 		<li><a href="ftv.astahost.com/buy/sets.php">Sets</a></li> 		<li><a href="ftv.astahost.com/buy/ads.php">Advertisements</a></li> 	  </ul> 	</li> 	<li><a href="#">Hire</a> 	  <ul> 		<li><a href="ftv.astahost.com/hire/crew.php">Crew</a></li> 		<li><a href="ftv.astahost.com/hire/writers.php">Writers</a></li> 	  </ul> 	</li> </ul><div id="banner"></div><center><font color=red size=12>Fantasized TeleVision</font> </center><h3><align="left"><font color=red><b>Site Under Construction</b></font></align></h3><center><b><a href="http://ftv.astahost.com/forum/" target=_"new">Visit the FTV Forum</a></b></center><p align="right"><b>Edge City</b></align><br>   <?php   $today = date("F j, Y, g:i");   echo $today   ?></body></html>

Share this post


Link to post
Share on other sites

O.K. I have just one question though. I wanted it to be that I could use the menu on many pages without having to type it over and over again. Thats why I was using CSS. Can't I just put it in a CSS file and have a link to it in all my pages, along with the menu style?

Share this post


Link to post
Share on other sites

Instead of having:

<style type="text/css">@import"main.css"</style>
or blah blah, try using
<link rel "stylesheet" href "main.css>
in your head tag. Found the thing on http://www.w3.org/. Try searching there for CSS tutorials to get you started. I tried searching they had a really good one, that covers all basics. :D

Also, try using the PHP include() function to embed the code of another htm/php file in that point. :unsure:

~souradipm
Edited by souradipm (see edit history)

Share this post


Link to post
Share on other sites

Yeah, HTML does not belong in a CSS file. It won't work there. I see what you want to do and here is the most obvious solution especially since you are already using PHP.

You can put your entire menu in its own file like menu.php.

menu.php:

<ul id="nav"><ul> 	 <li><a href="#">Profile</a></li>	   <ul>		 <li><a href="ftv.astahost.com/profile/person.php>Personal</a></li>		 <li><a href="ftv.astahost.com/profile/studio.php>Studio</a></li>	   </ul>	 </li>	 <li><a href="#">Buy</a> 	   <ul> 		 <li><a href="ftv.astahost.com/buy/studio.php">Studio</a></li> 		 <li><a href="ftv.astahost.com/buy/sets.php">Sets</a></li> 		 <li><a href="ftv.astahost.com/buy/ads.php">Advertisements</a></li> 	   </ul> 	 </li> 	 <li><a href="#">Hire</a> 	   <ul> 		 <li><a href="ftv.astahost.com/hire/crew.php">Crew</a></li> 		 <li><a href="ftv.astahost.com/hire/writers.php">Writers</a></li> 	   </ul> 	 </li>  </ul>

Then you can simply place all of your style information into a single CSS file. No reason to seperate them. The browser just reads what it needs for the document being shown anyhow. You can still use more than one CSS if you want but it isn't needed. The whole idea is to reduce the number of files you have to edit not increase them.

But in your main.php file, here is where you get to have some fun! :unsure:
You can now tell PHP to insert the contents of any file where ever you want in your document.
This is done using the PHP function include().

main.php
<html> <head> <TITLE> Fantasized TeleVision</TITLE> </head> <body> <LINK REL=stylesheet HREF="http://forums.xisto.com/no_longer_exists/; TYPE="text/css"> <LINK REL="stylesheet" HREF="menustyle.css" TYPE="text/css"> <?php include("http://forums.xisto.com/no_longer_exists/;; ?>     <div id="banner"></div> <center> <font color=red size=12>Fantasized TeleVision</font>  </center> <h3><align="left"><font color=red><b>Site Under Construction</b></font></align></h3> <center><b><a href="http://ftv.astahost.com/forum/" target=_"new">Visit the FTV Forum</a></b></center> <p align="right"><b>Edge City</b></align> <br>  <?php	$today = date("F j, Y, g:i");	echo $today	?> </body> </html>

This would result in the exact same output as was described by Emerald Green. The difference is that you can simple place one line of PHP into any of your PHP documents and that code will be included. Then you need only edit a single menu.php file if you need to make changes later on.

For more information on the subject, try this tutorial:
http://forums.xisto.com/topic/86340-topic/?findpost=1064320566

Hope this helps. :D

vujsa

Share this post


Link to post
Share on other sites

I'm not extremely good at CSS Menus and JavaScript. I think that if you just copy and paste the codes that you posted and nto change anything, it will work fine.If it works, don't change it. If you want to improve it, save a copy and then change it. If it fails, revert to the original copy. That will be much easier./(This is my first post)/

Share this post


Link to post
Share on other sites

I have problems with everything I am doing with my site, it is so frustrating! Ok, I've tried the suggestions here, and I've tried other tutorials but cant get a menu to work. I downloaded a menu maker (CoffeeCup Menu-Maker) and made a Javascript menu that way. Now, when I put the script in a file on my site (in cPanel) and just did the 'View File', it shows the menu as it is supposed to look. But when I use the <?php include ("filename") ?>, I just get this message:

Warning: main(http://forums.xisto.com/no_longer_exists/): failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /home/lonebyrd/public_html/begin/main.php on line 17
Warning: main(http://forums.xisto.com/no_longer_exists/): failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /home/lonebyrd/public_html/begin/main.php on line 17

Warning: main(): Failed opening 'http://forums.xisto.com/no_longer_exists/' for inclusion (include_path='.:/usr/lib/http://forums.xisto.com/no_longer_exists/;) in /home/lonebyrd/public_html/begin/main.php on line 17


But when I use the <LINK REL="stylesheet" HREF="mymenu" TYPE="text/css">, i get my site as it is supposed to look, but no menu.

So, since I can see the menu fine when I just look at the 'mymenu.js' file, I don't know why I cant get it to work on my other page. Help...Please.

Share this post


Link to post
Share on other sites

Sorry, I didn't realize that your menu was all JavaScript generated so I may have confused you as a result. All you need to do is prepare your JavaScript to be used as an external file and then insert a link to that file.

First you need to modify your existing mymenu.js file to be used as an external JavaScript file by removing your JavaScript tags like so:
http://forums.xisto.com/no_longer_exists/

function Go(){return}    /***********************************************************************      YOU CAN MANUALLY CHANGE THE MENU HERE, BUT BE VERY CAREFUL !  ***********************************************************************/    Menu1=new Array("Profile","http://ftv.astahost.com/profile.html","",2,20,80);    Menu1_1=new Array("Station","http://ftv.asthost.com/profile/station.html","",0,20,80);    Menu1_2=new Array("Personal","http://ftv.astahost.com/profile/personal.html","",0,20,0);    Menu2=new Array("Buy","http://ftv.astahost.com/buy.html","",3,0,80);    Menu2_1=new Array("Studio","http://ftv.astahost.com/buy/studio.html","",0,20,80);    Menu2_2=new Array("Sets","http://ftv.astahost.com/buy/sets.html","",0,20,0);    Menu2_3=new Array("Advertisments","http://ftv.astahost.com/buy/ads.html","",0,20,80);    Menu3=new Array("Hire","http://ftv.astahost.com/hire.html","",2,0,80);    Menu3_1=new Array("Crew","http://ftv.astahost.com/hire/crew.html","",0,20,80);    Menu3_2=new Array("Writers","http://ftv.astahost.com/hire/writers.html","",0,20,0);      var NoOffFirstLineMenus=3;    // Number of first level items  var LowBgColor='333300';        // Background color when mouse is not over  var LowSubBgColor='333300';    // Background color when mouse is not over on subs  var HighBgColor='0000FF';    // Background color when mouse is over  var HighSubBgColor='0000FF';    // Background color when mouse is over on subs  var FontLowColor='FF0000';    // Font color when mouse is not over  var FontSubLowColor='FF0000';    // Font color subs when mouse is not over  var FontHighColor='00FF00';    // Font color when mouse is over  var FontSubHighColor='00FF00';    // Font color subs when mouse is over  var BorderColor='808080';    // Border color  var BorderSubColor='808080';    // Border color for subs  var BorderWidth=2;        // Border width  var BorderBtwnElmnts=1;        // Border between elements 1 or 0  var FontFamily="Verdana"            // Font family menu items  var FontSize=9;            // Font size menu items  var FontBold=1;            // Bold menu items 1 or 0  var FontItalic=0;        // Italic menu items 1 or 0  var MenuTextCentered='left';    // Item text position 'left', 'center' or 'right'  var MenuCentered='left';    // Menu horizontal position 'left', 'center' or 'right'  var MenuVerticalCentered='top';    // Menu vertical position 'top', 'middle','bottom' or static  var ChildOverlap=.2;        // horizontal overlap child/ parent  var ChildVerticalOverlap=.2;    // vertical overlap child/ parent  var StartTop=1;        // Menu offset x coordinate  var StartLeft=1;        // Menu offset y coordinate  var VerCorrect=0;        // Multiple frames y correction  var HorCorrect=0;        // Multiple frames x correction  var LeftPaddng=3;        // Left padding  var TopPaddng=2;        // Top padding  var FirstLineHorizontal=0;    // SET TO 1 FOR HORIZONTAL MENU, 0 FOR VERTICAL  var MenuFramesVertical=1;    // Frames in cols or rows 1 or 0  var DissapearDelay=1000;    // delay before menu folds in  var TakeOverBgColor=1;        // Menu frame takes over background color subitem frame  var FirstLineFrame='navig';    // Frame where first level appears  var SecLineFrame='space';    // Frame where sub levels appear  var DocTargetFrame='space';    // Frame where target documents appear  var TargetLoc='';        // span id for relative positioning  var HideTop=0;            // Hide first level when loading new document 1 or 0  var MenuWrap=1;            // enables/ disables menu wrap 1 or 0  var RightToLeft=0;        // enables/ disables right to left unfold 1 or 0  var UnfoldsOnClick=0;        // Level 1 unfolds onclick/ onmouseover  var WebMasterCheck=0;        // menu tree checking on or off 1 or 0  var ShowArrow=1;        // Uses arrow gifs when 1  var KeepHilite=1;        // Keep selected path highligthed  var Arrws=['tri.gif',5,10,'tridown.gif',10,5,'trileft.gif',5,10];    // Arrow source, width and height      /***********************************************************************     DO NOT EDIT ANYTHING BELOW THIS LINE - IT WILL BREAK THE SCRIPT !  ***********************************************************************/    var AgntUsr=navigator.userAgent.toLowerCase();  var DomYes=document.getElementById?1:0;  var NavYes=AgntUsr.indexOf('mozilla')!=-1&&AgntUsr.indexOf('compatible')==-1?1:0;  var ExpYes=AgntUsr.indexOf('msie')!=-1?1:0;  var Opr=AgntUsr.indexOf('opera')!=-1?1:0;  var Opr6orless=window.opera && navigator.userAgent.search(/opera.[1-6]/i)!=-1 //DynamicDrive.com added code  var DomNav=DomYes&&NavYes?1:0;  var DomExp=DomYes&&ExpYes?1:0;  var Nav4=NavYes&&!DomYes&&document.layers?1:0;  var Exp4=ExpYes&&!DomYes&&document.all?1:0;  var PosStrt=(NavYes||ExpYes)&&!Opr6orless?1:0;  var FrstLoc,ScLoc,DcLoc;  var ScWinWdth,ScWinHght,FrstWinWdth,FrstWinHght;  var ScLdAgainWin;  var FirstColPos,SecColPos,DocColPos;  var RcrsLvl=0;  var FrstCreat=1,Loadd=0,Creatd=0,IniFlg,AcrssFrms=1;  var FrstCntnr=null,CurrntOvr=null,CloseTmr=null;  var CntrTxt,TxtClose,ImgStr;  var Ztop=100;  var ShwFlg=0;  var M_StrtTp=StartTop,M_StrtLft=StartLeft;  var StaticPos=0;  var LftXtra=DomNav&&!Opr?LeftPaddng:0; //Changed for Opera  var TpXtra=DomNav?TopPaddng:0;  var M_Hide=Nav4?'hide':'hidden';  var M_Show=Nav4?'show':'visible';  var Par=parent.frames[0]&&FirstLineFrame!=SecLineFrame?parent:window;  var Doc=Par.document;  var Bod=Doc.body;  var Trigger=NavYes&&!Opr?Par:Bod; //Changed for Opera   MenuTextCentered=MenuTextCentered==1||MenuTextCentered=='center'?'center':MenuTextCentered==0||MenuTextCentered!='right'?'left':'right';  WbMstrAlrts=["Item not defined: ","Item needs height: ","Item needs width: "];    if(Trigger.onload)Dummy=Trigger.onload;  if(DomNav||Opr)Trigger.addEventListener('load',Go,false); //Changed for Opera  else Trigger.onload=Go;    function Dummy(){return}    function CnclSlct(){return false}    function RePos(){      FrstWinWdth=ExpYes?FrstLoc.document.body.clientWidth:FrstLoc.innerWidth;      FrstWinHght=ExpYes?FrstLoc.document.body.clientHeight:FrstLoc.innerHeight;      ScWinWdth=ExpYes?ScLoc.document.body.clientWidth:ScLoc.innerWidth;      ScWinHght=ExpYes?ScLoc.document.body.clientHeight:ScLoc.innerHeight;      if(MenuCentered=='justify'&&FirstLineHorizontal){          FrstCntnr.style.width=FrstWinWdth;          ClcJus();          var P=FrstCntnr.FrstMbr,W=Menu1[5],i;          for(i=0;i<NoOffFirstLineMenus;i++){P.style.width=W;P=P.PrvMbr}}      StaticPos=-1;      if(TargetLoc)ClcTrgt();      if(MenuCentered)ClcLft();      if(MenuVerticalCentered)ClcTp();      PosMenu(FrstCntnr,StartTop,StartLeft)}    function UnLoaded(){      if(CloseTmr)clearTimeout(CloseTmr);      Loadd=0; Creatd=0;      if(HideTop){          var FCStyle=Nav4?FrstCntnr:FrstCntnr.style;          FCStyle.visibility=M_Hide}}    function ReDoWhole(){     if(ScWinWdth!=ScLoc.innerWidth||ScWinHght!=ScLoc.innerHeight||FrstWinWdth!=FrstLoc.innerWidth||FrstWinHght!=FrstLoc.innerHeight)Doc.location.reload()}    function Check(WMnu,NoOf){      var i,array,ArrayLoc;      ArrayLoc=parent.frames[0]?parent.frames[FirstLineFrame]:self;      for(i=0;i<NoOf;i++){          array=WMnu+eval(i+1);          if(!ArrayLoc[array]){WbMstrAlrt(0,array); return false}          if(i==0){    if(!ArrayLoc[array][4]){WbMstrAlrt(1,array); return false}              if(!ArrayLoc[array][5]){WbMstrAlrt(2,array); return false}}          if(ArrayLoc[array][3])if(!Check(array+'_',ArrayLoc[array][3])) return false}      return true}    function WbMstrAlrt(No,Xtra){      return confirm(WbMstrAlrts[No]+Xtra+'   ')}    function Go(){      Dummy();      if(Loadd||!PosStrt)return;      BeforeStart();      Creatd=0; Loadd=1;      status='Building menu';      if(FrstCreat){          if(FirstLineFrame =="" || !parent.frames[FirstLineFrame]){              FirstLineFrame=SecLineFrame;              if(FirstLineFrame =="" || !parent.frames[FirstLineFrame]){                  FirstLineFrame=SecLineFrame=DocTargetFrame;                 if(FirstLineFrame =="" || !parent.frames[FirstLineFrame])FirstLineFrame=SecLineFrame=DocTargetFrame=''}}          if(SecLineFrame =="" || !parent.frames[SecLineFrame]){              SecLineFrame=DocTargetFrame;             if(SecLineFrame =="" || !parent.frames[SecLineFrame])SecLineFrame=DocTargetFrame=FirstLineFrame}          if(DocTargetFrame =="" || !parent.frames[DocTargetFrame])DocTargetFrame=SecLineFrame;         if(WebMasterCheck){    if(!Check('Menu',NoOffFirstLineMenus)){status='build aborted';return}}          FrstLoc=FirstLineFrame!=""?parent.frames[FirstLineFrame]:window;          ScLoc=SecLineFrame!=""?parent.frames[SecLineFrame]:window;          DcLoc=DocTargetFrame!=""?parent.frames[DocTargetFrame]:window;          if (FrstLoc==ScLoc) AcrssFrms=0;          if (AcrssFrms)FirstLineHorizontal=MenuFramesVertical?0:1;          FrstWinWdth=ExpYes?FrstLoc.document.body.clientWidth:FrstLoc.innerWidth;          FrstWinHght=ExpYes?FrstLoc.document.body.clientHeight:FrstLoc.innerHeight;          ScWinWdth=ExpYes?ScLoc.document.body.clientWidth:ScLoc.innerWidth;          ScWinHght=ExpYes?ScLoc.document.body.clientHeight:ScLoc.innerHeight;         if(Nav4){    CntrTxt=MenuTextCentered!='left'?"<div align='"+MenuTextCentered+"'>":"";              TxtClose="</font>"+MenuTextCentered!='left'?"</div>":""}}      FirstColPos=Nav4?FrstLoc.document:FrstLoc.document.body;      SecColPos=Nav4?ScLoc.document:ScLoc.document.body;      DocColPos=Nav4?DcLoc.document:ScLoc.document.body;      if (TakeOverBgColor)FirstColPos.bgColor=AcrssFrms?SecColPos.bgColor:DocColPos.bgColor;      if(MenuCentered=='justify'&&FirstLineHorizontal)ClcJus();      if(FrstCreat){          FrstCntnr=CreateMenuStructure('Menu',NoOffFirstLineMenus);          FrstCreat=AcrssFrms?0:1}      else CreateMenuStructureAgain('Menu',NoOffFirstLineMenus);      if(TargetLoc)ClcTrgt();      if(MenuCentered)ClcLft();      if(MenuVerticalCentered)ClcTp();      PosMenu(FrstCntnr,StartTop,StartLeft);      IniFlg=1;      Initiate();      Creatd=1;      if (AcrssFrms)     //Added for Opera          {     //Added for Opera          ScLdAgainWin=ExpYes?ScLoc.document.body:ScLoc;          ScLdAgainWin.onunload=UnLoaded;          }     //Added for Opera      Trigger.onresize=Nav4?ReDoWhole:RePos;      AfterBuild();      if(MenuVerticalCentered=='static'&&!AcrssFrms)setInterval('KeepPos()',250);      status='Menu ready for use'}    function KeepPos(){      var TS=ExpYes?FrstLoc.document.body.scrollTop:FrstLoc.pageYOffset;      if(TS!=StaticPos){          var FCStyle=Nav4?FrstCntnr:FrstCntnr.style;          FCStyle.top=FrstCntnr.OrgTop=StartTop+TS;StaticPos=TS}}    function ClcJus(){      var a=BorderBtwnElmnts?1:2,b=BorderBtwnElmnts?BorderWidth:0;      var Size=Math.round(((FrstWinWdth-a*BorderWidth)/NoOffFirstLineMenus)-,i,j;      for(i=1;i<NoOffFirstLineMenus+1;i++){j=eval('Menu'+i);j[5]=Size}      StartLeft=0}    function ClcTrgt(){     var TLoc=Nav4?FrstLoc.document.layers[TargetLoc]:DomYes?FrstLoc.document.getElementById(TargetLoc):FrstLoc.document.all[TargetLoc];      StartTop=M_StrtTp;      StartLeft=M_StrtLft;      if(DomYes){          while(TLoc){StartTop+=TLoc.offsetTop;StartLeft+=TLoc.offsetLeft;TLoc=TLoc.offsetParent}}     else{    StartTop+=Nav4?TLoc.pageY:TLoc.offsetTop;StartLeft+=Nav4?TLoc.pageX:TLoc.offsetLeft}}    function ClcLft(){      if(MenuCentered!='left'&&MenuCentered!='justify'){          var Size=FrstWinWdth-(!Nav4?parseInt(FrstCntnr.style.width):FrstCntnr.clip.width);          StartLeft=M_StrtLft;          StartLeft+=MenuCentered=='right'?Size:Size/2}}    function ClcTp(){      if(MenuVerticalCentered!='top'&&MenuVerticalCentered!='static'){          var Size=FrstWinHght-(!Nav4?parseInt(FrstCntnr.style.height):FrstCntnr.clip.height);          StartTop=M_StrtTp;          StartTop+=MenuVerticalCentered=='bottom'?Size:Size/2}}    function PosMenu(CntnrPntr,Tp,Lt){      var Topi,Lefti,Hori;      var Cntnr=CntnrPntr;      var Mmbr=Cntnr.FrstMbr;      var CntnrStyle=!Nav4?Cntnr.style:Cntnr;      var MmbrStyle=!Nav4?Mmbr.style:Mmbr;      var PadL=Mmbr.value.indexOf('<')==-1?LftXtra:0;      var PadT=Mmbr.value.indexOf('<')==-1?TpXtra:0;      var MmbrWt=!Nav4?parseInt(MmbrStyle.width)+PadL:MmbrStyle.clip.width;      var MmbrHt=!Nav4?parseInt(MmbrStyle.height)+PadT:MmbrStyle.clip.height;      var CntnrWt=!Nav4?parseInt(CntnrStyle.width):CntnrStyle.clip.width;      var CntnrHt=!Nav4?parseInt(CntnrStyle.height):CntnrStyle.clip.height;      var SubTp,SubLt;      RcrsLvl++;     if (RcrsLvl==1 && AcrssFrms)!MenuFramesVertical?Tp=FrstWinHght-CntnrHt+(Nav4?4:0):Lt=RightToLeft?0:FrstWinWdth-CntnrWt+(Nav4?4:0);      if (RcrsLvl==2 && AcrssFrms)!MenuFramesVertical?Tp=0:Lt=RightToLeft?ScWinWdth-CntnrWt:0;      if (RcrsLvl==2 && AcrssFrms){Tp+=VerCorrect;Lt+=HorCorrect}      CntnrStyle.top=RcrsLvl==1?Tp:0;      Cntnr.OrgTop=Tp;      CntnrStyle.left=RcrsLvl==1?Lt:0;      Cntnr.OrgLeft=Lt;      if (RcrsLvl==1 && FirstLineHorizontal){          Hori=1;Lefti=CntnrWt-MmbrWt-2*BorderWidth;Topi=0}      else{    Hori=Lefti=0;Topi=CntnrHt-MmbrHt-2*BorderWidth}      while(Mmbr!=null){          MmbrStyle.left=Lefti+BorderWidth;          MmbrStyle.top=Topi+BorderWidth;          if(Nav4)Mmbr.CmdLyr.moveTo(Lefti+BorderWidth,Topi+BorderWidth);          if(Mmbr.ChildCntnr){             if(RightToLeft)ChldCntnrWdth=Nav4?Mmbr.ChildCntnr.clip.width:parseInt(Mmbr.ChildCntnr.style.width);              if(Hori){    SubTp=Topi+MmbrHt+2*BorderWidth;                 SubLt=RightToLeft?Lefti+MmbrWt-ChldCntnrWdth:Lefti}             else{    SubLt=RightToLeft?Lefti-ChldCntnrWdth+ChildOverlap*MmbrWt+BorderWidth:Lefti+(1-ChildOverlap)*MmbrWt+BorderWidth;                 SubTp=RcrsLvl==1&&AcrssFrms?Topi:Topi+ChildVerticalOverlap*MmbrHt}              PosMenu(Mmbr.ChildCntnr,SubTp,SubLt)}          Mmbr=Mmbr.PrvMbr;          if(Mmbr){    MmbrStyle=!Nav4?Mmbr.style:Mmbr;              PadL=Mmbr.value.indexOf('<')==-1?LftXtra:0;              PadT=Mmbr.value.indexOf('<')==-1?TpXtra:0;              MmbrWt=!Nav4?parseInt(MmbrStyle.width)+PadL:MmbrStyle.clip.width;              MmbrHt=!Nav4?parseInt(MmbrStyle.height)+PadT:MmbrStyle.clip.height;             Hori?Lefti-=BorderBtwnElmnts?(MmbrWt+BorderWidth):(MmbrWt):Topi-=BorderBtwnElmnts?(MmbrHt+BorderWidth):(MmbrHt)}}      RcrsLvl--}    function Initiate(){      if(IniFlg){    Init(FrstCntnr);IniFlg=0;          if(ShwFlg)AfterCloseAll();ShwFlg=0}}    function Init(CntnrPntr){      var Mmbr=CntnrPntr.FrstMbr;      var MCStyle=Nav4?CntnrPntr:CntnrPntr.style;      RcrsLvl++;      MCStyle.visibility=RcrsLvl==1?M_Show:M_Hide;      while(Mmbr!=null){          if(Mmbr.Hilite){Mmbr.Hilite=0;if(KeepHilite)LowItem(Mmbr)}          if(Mmbr.ChildCntnr) Init(Mmbr.ChildCntnr);          Mmbr=Mmbr.PrvMbr}      RcrsLvl--}    function ClearAllChilds(Pntr){      var CPCCStyle;      while (Pntr){          if(Pntr.Hilite){              Pntr.Hilite=0;              if(KeepHilite)LowItem(Pntr);              if(Pntr.ChildCntnr){                 CPCCStyle=Nav4?Pntr.ChildCntnr:Pntr.ChildCntnr.style;                  CPCCStyle.visibility=M_Hide;                  ClearAllChilds(Pntr.ChildCntnr.FrstMbr)}              break}          Pntr=Pntr.PrvMbr}}    function GoTo(){      if(this.LinkTxt){          status='';          var HP=Nav4?this.LowLyr:this;          LowItem(HP);         this.LinkTxt.indexOf('java script:')!=-1?eval(this.LinkTxt):DcLoc.location.href=this.LinkTxt}}    function HiliteItem(P){      if(Nav4){          if(P.ro)P.document.images[P.rid].src=P.ri2;          else{    if(P.HiBck)P.bgColor=P.HiBck;              if(P.value.indexOf('<img')==-1){                  P.document.write(P.Ovalue);                  P.document.close()}}}      else{    if(P.ro){    var Lc=P.Level==1?FrstLoc:ScLoc;              Lc.document.images[P.rid].src=P.ri2}          else{    if(P.HiBck)P.style.backgroundColor=P.HiBck;              if(P.HiFntClr)P.style.color=P.HiFntClr}}      P.Hilite=1}    function LowItem(P){      if(P.ro){    if(Nav4)P.document.images[P.rid].src=P.ri1;          else{    var Lc=P.Level==1?FrstLoc:ScLoc;              Lc.document.images[P.rid].src=P.ri1}}      else{    if(Nav4){    if(P.LoBck)P.bgColor=P.LoBck;              if(P.value.indexOf('<img')==-1){                  P.document.write(P.value);                  P.document.close()}}          else{    if(P.LoBck)P.style.backgroundColor=P.LoBck;              if(P.LwFntClr)P.style.color=P.LwFntClr}}}    function OpenMenu(){      if(!Loadd||!Creatd) return;      var TpScrlld=ExpYes?ScLoc.document.body.scrollTop:ScLoc.pageYOffset;      var LScrlld=ExpYes?ScLoc.document.body.scrollLeft:ScLoc.pageXOffset;      var CCnt=Nav4?this.LowLyr.ChildCntnr:this.ChildCntnr;      var ThisHt=Nav4?this.clip.height:parseInt(this.style.height);      var ThisWt=Nav4?this.clip.width:parseInt(this.style.width);     var ThisLft=AcrssFrms&&this.Level==1&&!FirstLineHorizontal?0:Nav4?this.Container.left:parseInt(this.Container.style.left);     var ThisTp=AcrssFrms&&this.Level==1&&FirstLineHorizontal?0:Nav4?this.Container.top:parseInt(this.Container.style.top);      var HP=Nav4?this.LowLyr:this;      CurrntOvr=this;      IniFlg=0;      ClearAllChilds(this.Container.FrstMbr);      HiliteItem(HP);      if(CCnt!=null){          if(!ShwFlg){ShwFlg=1;    BeforeFirstOpen()}          var CCW=Nav4?this.LowLyr.ChildCntnr.clip.width:parseInt(this.ChildCntnr.style.width);          var CCH=Nav4?this.LowLyr.ChildCntnr.clip.height:parseInt(this.ChildCntnr.style.height);          var ChCntTL=Nav4?this.LowLyr.ChildCntnr:this.ChildCntnr.style;         var SubLt=AcrssFrms&&this.Level==1?CCnt.OrgLeft+ThisLft+LScrlld:CCnt.OrgLeft+ThisLft;         var SubTp=AcrssFrms&&this.Level==1?CCnt.OrgTop+ThisTp+TpScrlld:CCnt.OrgTop+ThisTp;          if(MenuWrap){              if(RightToLeft){                 if(SubLt<LScrlld)SubLt=this.Level==1?LScrlld:SubLt+(CCW+(1-2*ChildOverlap)*ThisWt);                 if(SubLt+CCW>ScWinWdth+LScrlld)SubLt=ScWinWdth+LScrlld-CCW}             else{    if(SubLt+CCW>ScWinWdth+LScrlld)SubLt=this.Level==1?ScWinWdth+LScrlld-CCW:SubLt-(CCW+(1-2*ChildOverlap)*ThisWt);                  if(SubLt<LScrlld)SubLt=LScrlld}             if(SubTp+CCH>TpScrlld+ScWinHght)SubTp=this.Level==1?SubTp=TpScrlld+ScWinHght-CCH:SubTp-CCH+(1-2*ChildVerticalOverlap)*ThisHt;              if(SubTp<TpScrlld)SubTp=TpScrlld}          ChCntTL.top=SubTp;ChCntTL.left=SubLt;ChCntTL.visibility=M_Show}      status=this.LinkTxt}    function OpenMenuClick(){      if(!Loadd||!Creatd) return;      var HP=Nav4?this.LowLyr:this;      CurrntOvr=this;      IniFlg=0;      ClearAllChilds(this.Container.FrstMbr);      HiliteItem(HP);      status=this.LinkTxt}    function CloseMenu(){      if(!Loadd||!Creatd) return;      if(!KeepHilite){          var HP=Nav4?this.LowLyr:this;          LowItem(HP)}      status='';      if(this==CurrntOvr){          IniFlg=1;          if(CloseTmr)clearTimeout(CloseTmr);          CloseTmr=setTimeout('Initiate(CurrntOvr)',DissapearDelay)}}    function CntnrSetUp(Wdth,Hght,NoOff){      var x=RcrsLvl==1?BorderColor:BorderSubColor;      this.FrstMbr=null;      this.OrgLeft=this.OrgTop=0;      if(x)this.bgColor=x;      if(Nav4){    this.visibility='hide';          this.resizeTo(Wdth,Hght)}      else{    if(x)this.style.backgroundColor=x;          this.style.width=Wdth;          this.style.height=Hght;          this.style.fontFamily=FontFamily;          this.style.fontWeight=FontBold?'bold':'normal';          this.style.fontStyle=FontItalic?'italic':'normal';          this.style.fontSize=FontSize+'pt';          this.style.zIndex=RcrsLvl+Ztop}}    function MbrSetUp(MmbrCntnr,PrMmbr,WhatMenu,Wdth,Hght){      var Location=RcrsLvl==1?FrstLoc:ScLoc;      var MemVal=eval(WhatMenu+'[0]');      var t,T,L,W,H,S;      var a,b,c,d;      this.PrvMbr=PrMmbr;      this.Level=RcrsLvl;      this.LinkTxt=eval(WhatMenu+'[1]');      this.Container=MmbrCntnr;      this.ChildCntnr=null;      this.Hilite=0;      this.style.overflow='hidden';      this.style.cursor=ExpYes&&(this.LinkTxt||(RcrsLvl==1&&UnfoldsOnClick))?'hand':'default';      this.ro=0;      if(MemVal.indexOf('rollover')!=-1){          this.ro=1;          this.ri1=MemVal.substring(MemVal.indexOf(':')+1,MemVal.lastIndexOf(':'));          this.ri2=MemVal.substring(MemVal.lastIndexOf(':')+1,MemVal.length);          this.rid=WhatMenu+'i';MemVal="<img src='"+this.ri1+"' name='"+this.rid+"'>"}      this.value=MemVal;      if(RcrsLvl==1){          a=LowBgColor;          b=HighBgColor;          c=FontLowColor;          d=FontHighColor}      else{    a=LowSubBgColor;          b=HighSubBgColor;          c=FontSubLowColor;          d=FontSubHighColor}      this.LoBck=a;      this.LwFntClr=c;      this.HiBck=b;      this.HiFntClr=d;      this.style.color=this.LwFntClr;      if(this.LoBck)this.style.backgroundColor=this.LoBck;      this.style.textAlign=MenuTextCentered;      if(eval(WhatMenu+'[2]'))this.style.backgroundImage="url(\'"+eval(WhatMenu+'[2]')+"\')";      if(MemVal.indexOf('<')==-1){          this.style.width=Wdth-LftXtra;          this.style.height=Hght-TpXtra;          this.style.paddingLeft=LeftPaddng;          this.style.paddingTop=TopPaddng}      else{    this.style.width=Wdth;          this.style.height=Hght}      if(MemVal.indexOf('<')==-1&&DomYes){          t=Location.document.createTextNode(MemVal);          this.appendChild(t)}      else this.innerHTML=MemVal;      if(eval(WhatMenu+'[3]')&&ShowArrow){          a=RcrsLvl==1&&FirstLineHorizontal?3:RightToLeft?6:0;          S=Arrws[a];          W=Arrws[a+1];          H=Arrws[a+2];          T=RcrsLvl==1&&FirstLineHorizontal?Hght-H-2:(Hght-H)/2;          L=RightToLeft?2:Wdth-W-2;          if(DomYes){                t=Location.document.createElement('img');              this.appendChild(t);              t.style.position='absolute';              t.src=S;                t.style.width=W;              t.style.height=H;              t.style.top=T;              t.style.left=L}         else{    MemVal+="<div style='position:absolute; top:"+T+"; left:"+L+"; width:"+W+"; height:"+H+";visibility:inherit'><img src='"+S+"'></div>";              this.innerHTML=MemVal}}      if(ExpYes){this.onselectstart=CnclSlct;          this.onmouseover=RcrsLvl==1&&UnfoldsOnClick?OpenMenuClick:OpenMenu;          this.onmouseout=CloseMenu;         this.onclick=RcrsLvl==1&&UnfoldsOnClick&&eval(WhatMenu+'[3]')?OpenMenu:GoTo    }     else{    RcrsLvl==1&&UnfoldsOnClick?this.addEventListener('mouseover',OpenMenuClick,false):this.addEventListener('mouseover',OpenMenu,false);          this.addEventListener('mouseout',CloseMenu,false);         RcrsLvl==1&&UnfoldsOnClick&&eval(WhatMenu+'[3]')?this.addEventListener('click',OpenMenu,false):this.addEventListener('click',GoTo,false)}}    function NavMbrSetUp(MmbrCntnr,PrMmbr,WhatMenu,Wdth,Hght){      var a,b,c,d;      if(RcrsLvl==1){          a=LowBgColor;          b=HighBgColor;          c=FontLowColor;          d=FontHighColor}      else {    a=LowSubBgColor;          b=HighSubBgColor;          c=FontSubLowColor;          d=FontSubHighColor    }      this.value=eval(WhatMenu+'[0]');      this.ro=0;      if(this.value.indexOf('rollover')!=-1){          this.ro=1;          this.ri1=this.value.substring(this.value.indexOf(':')+1,this.value.lastIndexOf(':'));          this.ri2=this.value.substring(this.value.lastIndexOf(':')+1,this.value.length);          this.rid=WhatMenu+'i';this.value="<img src='"+this.ri1+"' name='"+this.rid+"'>"}     if(LeftPaddng&&this.value.indexOf('<')==-1&&MenuTextCentered=='left')this.value=' \;'+this.value;      if(FontBold)this.value=this.value.bold();      if(FontItalic)this.value=this.value.italics();      this.Ovalue=this.value;      this.value=this.value.fontcolor©;      this.Ovalue=this.Ovalue.fontcolor(d);      this.value=CntrTxt+"<font face='"+FontFamily+"' point-size='"+FontSize+"'>"+this.value+TxtClose;      this.Ovalue=CntrTxt+"<font face='"+FontFamily+"' point-size='"+FontSize+"'>"+this.Ovalue+TxtClose;      this.LoBck=a;      this.HiBck=b;      this.ChildCntnr=null;      this.PrvMbr=PrMmbr;      this.Hilite=0;      this.visibility='inherit';      if(this.LoBck)this.bgColor=this.LoBck;      this.resizeTo(Wdth,Hght);      if(!AcrssFrms&&eval(WhatMenu+'[2]'))this.background.src=eval(WhatMenu+'[2]');      this.document.write(this.value);      this.document.close();      this.CmdLyr=new Layer(Wdth,MmbrCntnr);      this.CmdLyr.Level=RcrsLvl;      this.CmdLyr.LinkTxt=eval(WhatMenu+'[1]');      this.CmdLyr.visibility='inherit';      this.CmdLyr.onmouseover=RcrsLvl==1&&UnfoldsOnClick?OpenMenuClick:OpenMenu;      this.CmdLyr.onmouseout=CloseMenu;      this.CmdLyr.captureEvents(Event.MOUSEUP);      this.CmdLyr.onmouseup=RcrsLvl==1&&UnfoldsOnClick&&eval(WhatMenu+'[3]')?OpenMenu:GoTo;      this.CmdLyr.LowLyr=this;      this.CmdLyr.resizeTo(Wdth,Hght);      this.CmdLyr.Container=MmbrCntnr;      if(eval(WhatMenu+'[3]')&&ShowArrow){          a=RcrsLvl==1&&FirstLineHorizontal?3:RightToLeft?6:0;          this.CmdLyr.ImgLyr=new Layer(Arrws[a+1],this.CmdLyr);          this.CmdLyr.ImgLyr.visibility='inherit';         this.CmdLyr.ImgLyr.top=RcrsLvl==1&&FirstLineHorizontal?Hght-Arrws[a+2]-2:(Hght-Arrws[a+2])/2;          this.CmdLyr.ImgLyr.left=RightToLeft?2:Wdth-Arrws[a+1]-2;          this.CmdLyr.ImgLyr.width=Arrws[a+1];          this.CmdLyr.ImgLyr.height=Arrws[a+2];          ImgStr="<img src='"+Arrws[a]+"' width='"+Arrws[a+1]+"' height='"+Arrws[a+2]+"'>";          this.CmdLyr.ImgLyr.document.write(ImgStr);          this.CmdLyr.ImgLyr.document.close()}}    function CreateMenuStructure(MName,NumberOf){      RcrsLvl++;      var i,NoOffSubs,Mbr,Wdth=0,Hght=0;      var PrvMmbr=null;      var WMnu=MName+'1';      var MenuWidth=eval(WMnu+'[5]');      var MenuHeight=eval(WMnu+'[4]');      var Location=RcrsLvl==1?FrstLoc:ScLoc;      if (RcrsLvl==1&&FirstLineHorizontal){          for(i=1;i<NumberOf+1;i++){              WMnu=MName+eval(i);              Wdth=eval(WMnu+'[5]')?Wdth+eval(WMnu+'[5]'):Wdth+MenuWidth}         Wdth=BorderBtwnElmnts?Wdth+(NumberOf+1)*BorderWidth:Wdth+2*BorderWidth;Hght=MenuHeight+2*BorderWidth}      else{    for(i=1;i<NumberOf+1;i++){              WMnu=MName+eval(i);              Hght=eval(WMnu+'[4]')?Hght+eval(WMnu+'[4]'):Hght+MenuHeight}         Hght=BorderBtwnElmnts?Hght+(NumberOf+1)*BorderWidth:Hght+2*BorderWidth;Wdth=MenuWidth+2*BorderWidth}      if(DomYes){          var MmbrCntnr=Location.document.createElement("div");          MmbrCntnr.style.position='absolute';          MmbrCntnr.style.visibility='hidden';          Location.document.body.appendChild(MmbrCntnr)}      else{    if(Nav4) var MmbrCntnr=new Layer(Wdth,Location)          else{    WMnu+='c';             Location.document.body.insertAdjacentHTML("AfterBegin","<div id='"+WMnu+"' style='visibility:hidden; position:absolute;'><\/div>");              var MmbrCntnr=Location.document.all[WMnu]}}      MmbrCntnr.SetUp=CntnrSetUp;      MmbrCntnr.SetUp(Wdth,Hght,NumberOf);      if(Exp4){    MmbrCntnr.InnerString='';          for(i=1;i<NumberOf+1;i++){              WMnu=MName+eval(i);             MmbrCntnr.InnerString+="<div id='"+WMnu+"' style='position:absolute;'><\/div>"}          MmbrCntnr.innerHTML=MmbrCntnr.InnerString}      for(i=1;i<NumberOf+1;i++){          WMnu=MName+eval(i);          NoOffSubs=eval(WMnu+'[3]');         Wdth=RcrsLvl==1&&FirstLineHorizontal?eval(WMnu+'[5]')?eval(WMnu+'[5]'):MenuWidth:MenuWidth;         Hght=RcrsLvl==1&&FirstLineHorizontal?MenuHeight:eval(WMnu+'[4]')?eval(WMnu+'[4]'):MenuHeight;          if(DomYes){              Mbr=Location.document.createElement("div");              Mbr.style.position='absolute';              Mbr.style.visibility='inherit';              MmbrCntnr.appendChild(Mbr)}          else Mbr=Nav4?new Layer(Wdth,MmbrCntnr):Location.document.all[WMnu];          Mbr.SetUp=Nav4?NavMbrSetUp:MbrSetUp;          Mbr.SetUp(MmbrCntnr,PrvMmbr,WMnu,Wdth,Hght);          if(NoOffSubs) Mbr.ChildCntnr=CreateMenuStructure(WMnu+'_',NoOffSubs);          PrvMmbr=Mbr}      MmbrCntnr.FrstMbr=Mbr;      RcrsLvl--;      return(MmbrCntnr)}    function CreateMenuStructureAgain(MName,NumberOf){      var i,WMnu,NoOffSubs,PrvMmbr,Mbr=FrstCntnr.FrstMbr;      RcrsLvl++;      for(i=NumberOf;i>0;i--){          WMnu=MName+eval(i);          NoOffSubs=eval(WMnu+'[3]');          PrvMmbr=Mbr;          if(NoOffSubs)Mbr.ChildCntnr=CreateMenuStructure(WMnu+'_',NoOffSubs);          Mbr=Mbr.PrvMbr}      RcrsLvl--}    function BeforeStart(){return}  function AfterBuild(){return}  function BeforeFirstOpen(){return}  function AfterCloseAll(){return}

Then in whatever page that you want to display your menu, then you need only insert a couple of lines of code like so:
<html>	  <head>		  <title>			  My JavaScript Menu		  </title>		  <meta name="description" content="">		  <meta name="keywords" content="">		  <meta name="author" content="ftv">		  <script language="JavaScript" src="http://forums.xisto.com/no_longer_exists/;			</script>		   <noscript>Your browser does not support script</noscript>	  </head>	  <body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080">		  Your main page content here.	  </body>  </html>

That's it, just insert the required JavaScript into your webpages.
<script language="JavaScript" src="http://forums.xisto.com/no_longer_exists/;			</script>		   <noscript>Your browser does not support script>

Then just adjust your variables to change the look of your menu. Be careful with the variables.
This controls the position of the top left corner of the menu:
	  var StartTop=1;		// Menu offset x coordinate	var StartLeft=1;		// Menu offset y coordinate

Well, I think this will get you what you need.

One other thing, on your main page, you have an error. Your buttons will not take the user to the right place with all browsers. To keep this from happening, either use relational URL's or absolute URL's.
Relational URL: mypage.html or directory/mypage.html
Absolute URL: http://forums.xisto.com/no_longer_exists/

Currently with some browsers, the URL points to this:http://forums.xisto.com/no_longer_exists/
Basically, you left out the http:// which has caused the problems.

Hope This Helps. :D

vujsa

Share this post


Link to post
Share on other sites

Finally, success! I've gotten one of the many tries to work (with some help :unsure: ). But one more problem has popped up. I've worked it out so the menu shows up correct on the page I wanted it too. I don't have all the links working yet, but the menu is there. Now, for one of the pages that the menu links to, I wanted to put the menu on. Ok that was confusing. I wanted to put the menu on another page in other words. Therin lies the problem. I put exactly the same coding that was needing in the first page, into the new page, but it doesn't work. It requires a couple of javascript files and a body onload thingy. I guess I'll just post the code for the page I'm working on here:

<html><head><TITLE> Buy Studio</TITLE><script type="text/javascript" src="includes/browser.js">/************************************************ Jim's DHTML Menu v5.7- Š Jim Salyer (jsalyer@REMOVETHISmchsi.com)* Visit Dynamic Drive: http://http://www.dynamicdrive.com/ for script and instructions* This notice must stay intact for use***********************************************/</script><script type="text/javascript" src="config.js"></script><LINK REL=stylesheet HREF="http://forums.xisto.com/no_longer_exists/; TYPE="text/css"></head><body background="http:http://forums.xisto.com/no_longer_exists/;   onload="init()"><center><font color=red size=12>Fantasized TeleVision</font><center><table border="2" Cellspacing="1" Cellpadding="1"><Caption><font color="red"><h2>Studio's</h2></font></Caption><TR><TD Align = "center"><u>Public Access</u></TD>	<TD Align = "center"><u># Sets Allowed</u></TD>	<TD Align = "center"><u>Max Crew Allowed</u></TD>	<TD Align = "center"><u>Ad Type</u></TD></TR><TR><TD Align = "center">Level 1</TD>	<TD Align = "center">1</TD>	<TD Align = "center">4</TD>	<TD Align = "center">Local</TD></TR><TR><TD Align = "center">Level 2</TD>	<TD Align = "center">2</TD>	<TD Align = "center">5</TD>	<TD Align = "center">Local</TD></TR><TR><TD Align = "center">Level 3</TD>	<TD Align = "center">4</TD>	<TD Align = "center">8</TD>	<TD Align = "center">Local</TD></TR><TR><TD Align = "center"><u>Local Station</u></TD></TR>.....
The table does go on and it is correct, but I figured I'd save some space and not show it all. That part worked fine. This is just a basic work-up of my webpage, it is nowhere near complete, but none-the-less, the menu won't show up. Any suggestions?

Share this post


Link to post
Share on other sites

I imagine that this is caused by bad addresses to the JavaScript files.

 

For example, on your main.php you use "includes/browser.js". This is a relative link which only works on files that are in the same directory as main.php. If the file you want add the menu to is in in a different directory, then the link will be broken. Explained below:

If the absolute url to "browser.js" is like so:

http://forums.xisto.com/no_longer_exists/browser.js

and the absolute url for main.php is like so:

http://forums.xisto.com/no_longer_exists/

Then everything works fine since the file "main.php" and the directory "includes" reside in the same directory.

 

But if you add the code to a file outside of the same directory with a url like this:

http://forums.xisto.com/no_longer_exists/

then when the browser looks for "includes/browser.js" it will actually look in the following place:

http://forums.xisto.com/no_longer_exists/

 

To solve this problem, then I suggest that you use absolute urls for your code instead of relative urls.

 

So instead of using src="includes/browser.js" on your pages, you should use

.

 

This way your user's browser will always be able to find the file no matter what directory they are working in.

 

You'll need to do the same thing with your src="config.js" code as well.

 

One other thing that can help keep you organized is to create a directory called "javascripts" and place all of your JavaScript files there. You can just rename your "includes" directory to "javascripts" and then moove "config.js" there. If you decide to do this, then you will NEED to edit the "browser.js" file.

You would need to change the second line from

var buildDir = "includes/";
to

var buildDir = "javascripts/";

Also, you would have to change your "main.php" and any other file you want to show your menu in like so:

Hope This Helps. :unsure:

 

vujsa

Share this post


Link to post
Share on other sites

Well, I woke up this morning and had that very same idea, to add the full address... but that didn't work. I've checked exactly for matchups and can't find the problem. It was a direct copy from the other page and all I did was add the http thing but it was a no go.Funny thing about making the 'includes' folder into a 'javascript' folder though. As soon as I did that, the menu no longer appeared on my main page anymore. I moved the config.js file there and changed the name to javascript. I changed the script so it said javascript/browser.js and javascript/config.js, and what do you know... It just didn't work. Checked the spelling twice. Changed it back to includes and it worked fine. I don't know about that one.Anyway, still don't know what to do about my other page. Even after adding the full address it didn't come up. Could it be the way my page is laid out?

Share this post


Link to post
Share on other sites

Are you sure that you updated your browser.js file?
currently it reads like this at the top:

//---- Set this variable only! ---- var buildDir = "includes/"; //---------------------------------

If you changed thename of the includes directory then this file needs to be updated to reaad like this at the top:
//---- Set this variable only! ----  var buildDir = "javascripts/";  //---------------------------------

I see that yopu were able to move your config.js file without any trouble. :unsure:

Also, if you wanted to have more than one menu, you can simple use a secondary configuration file.

The new file would be something like config2.js and can be different than the config.js file which would allow for two different menus. Then just request the menu you want to use on each page by requesting either config.js or config2.js. There would be no need to make a second copy of the browser.js file it would just get reused each time and you would request it as you do now.

I'm not sure if the script will allow for the use of two menus on a single page but you can give it a try. This would work best on a horizontal menu which you could place at the top an bottom of your page for easiest navigation. :D

vujsa

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.