document.write("<scr"+"ipt type=\"text/javascript\" src=\"javascript/ypSlideOutMenusC_pj.js\"></script>");
//document.write("<scr"+"ipt type=\"text/javascript\" src=\"javascript/aqtree3clickable.js\"></script>");
document.write("<scr"+"ipt type=\"text/javascript\" src=\"javascript/AnchorPosition.js\"></script>");


addEvent(window, "load", function(){ buildNav('mainNav','menubar',25,150,300)});
addEvent(window, "resize", function(){ repositionMenus(); } );
addEvent(window, "load", function(){ buttonBehavior(); } );

// I really try to avoid browser detection, but Safari (as of v4) does not implement the image.complete property properly
var detect = navigator.userAgent.toLowerCase();
var OS,browser,version,total,thestring;

if (checkIt('konqueror'))
{
        browser = "Konqueror";
        OS = "Linux";
}
else if (checkIt('safari')) browser = "Safari"
else if (checkIt('omniweb')) browser = "OmniWeb"
else if (checkIt('opera')) browser = "Opera"
else if (checkIt('webtv')) browser = "WebTV";
else if (checkIt('icab')) browser = "iCab"
else if (checkIt('msie')) browser = "Internet Explorer"
else if (!checkIt('compatible'))
{
        browser = "Netscape Navigator"
        version = detect.charAt(8);
}
else browser = "An unknown browser";

if (!version) version = detect.charAt(place + thestring.length);

if (!OS)
{
        if (checkIt('linux')) OS = "Linux";
        else if (checkIt('x11')) OS = "Unix";
        else if (checkIt('mac')) OS = "Mac"
        else if (checkIt('win')) OS = "Windows"
        else OS = "an unknown operating system";
}

function checkIt(string)
{
        place = detect.indexOf(string) + 1;
        thestring = string;
        return place;
}

<!--{{{ buildNav() function -->

function buildNav(sourceList,destDiv,menubarH,menuW,menuH) {
	
	var destDiv = document.getElementById(destDiv);
	var sourceList = document.getElementById(sourceList);
	// we could do a test on the createElement functionality

	var preloadedMouseOvers = new Array();
		
	var actCount = 0;  // count the actuators
	menuCount = 1; // count the menus
	// we set a convenience variable, navRoot so we can easily refer to it
	var navRoot = sourceList;
	
	//now we loop through all navRoot's children which should all be <li>
	for (var i=0; i<navRoot.childNodes.length; i++) {
	// we set another convenience variable, node
	node = navRoot.childNodes[i];
		if (node.nodeName=="LI") {
			obj = node.childNodes[0].firstChild;
			// we make the menu bar link
			var link = document.createElement('a');
			link.href=node.firstChild.getAttribute('href');
			link.className = 'menubarLink';
			// we need to know if this list has only one list item
			var liCount = 0;
			if(node.childNodes.length >= 3){
				for (x=0; x<node.childNodes[2].childNodes.length; x++){
					tmpNode = node.childNodes[2].childNodes[x];
					if(tmpNode.nodeName == 'LI'){
						liCount++;
						if(liCount == 1){
							firstListItem = tmpNode;
						}
					}
				}
			}
			var linkText = document.createTextNode(obj.nodeValue);
			
			if((node.childNodes.length >= 3) && (node.childNodes[2].nodeName == "UL") && (liCount > 1)){
				if(link.href == "#"){
					link.oncick= function(){ return false; }
				}
				eval("link.onmouseover = function(){ repositionMenus();ypSlideOutMenu.showMenu('menu"+menuCount+"');}")
				eval("link.onmouseout = function(){ ypSlideOutMenu.hideMenu('menu"+menuCount+"');}")
			
				link.id= 'act'+actCount;
				link.name= 'act'+actCount;
				
				
				var textImage = document.createElement('img');
				textImage.id = "act"+actCount+"textImage";
				if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
					textImage.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=84a5b1&text="+escape(obj.nodeValue.toUpperCase());
				}else{
					textImage.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=84a5b1&text="+encodeURI(obj.nodeValue.toUpperCase());
				}
				textImage.align = 'top';
				
				preloadTemp = new Image();
				if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
					preloadTemp.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=eae4cc&text="+escape(obj.nodeValue.toUpperCase());
				}else{
					preloadTemp.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=eae4cc&text="+encodeURI(obj.nodeValue.toUpperCase());
					preloadedMouseOvers.push(preloadTemp);
				}
				
						
				//link.appendChild(linkText);
				link.appendChild(textImage);
				destDiv.appendChild(link);
						
				var menuX = getAnchorPosition('act'+actCount).x;
				var menuY = getAnchorPosition('act'+actCount).y + menubarH;
				if(browser == "Safari"){ menuY = menuY-3; }
				if( (browser == 'Internet Explorer') && (OS == 'Mac') ){ menuY = menuY - 3; }
				
				var subNavList = node.childNodes[2].cloneNode(true);
				subNavList.className="aqtree3clickable";
			
				// TODO : this only dives one level deep, so for future implementations, it will need to be fleshed out
				// this loop could be encapsulated into a recursive function.
			
				for (x=0; x<subNavList.childNodes.length; x++){
					if(subNavList.childNodes[x].nodeName == "LI"){
						//alert(subNavList.childNodes[x].innerHTML);
						//alert(subNavList.childNodes[x].childNodes[0].childNodes[0].nodeValue);
						var textImage = document.createElement('img');
						textImage.align = 'top';
						if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
							textImage.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5.25&font_color=000000&background_color=c0c0c0&text="+escape(subNavList.childNodes[x].childNodes[0].alt);
							eval("subNavList.childNodes[x].childNodes[0].onmouseover = function(){ this.childNodes[0].src='heading.php?font=CenturyGothic-Bold&font_size=7.5.25&font_color=FFFFFF&background_color=c0c0c0&text="+escape(subNavList.childNodes[x].childNodes[0].alt)+"';}");
							eval("subNavList.childNodes[x].childNodes[0].onmouseout = function(){ this.childNodes[0].src='heading.php?font=CenturyGothic-Bold&font_size=7.5.25&font_color=000000&background_color=84a5b1&text="+escape(subNavList.childNodes[x].childNodes[0].alt)+"';}");
				
						}else{
							textImage.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5.25&font_color=000000&background_color=c0c0c0&text="+encodeURI(subNavList.childNodes[x].childNodes[0].childNodes[0].nodeValue.toUpperCase());
							preloadTemp = new Image();
							preloadTemp.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5.25&font_color=000000&background_color=eae4cc&text="+encodeURI(subNavList.childNodes[x].childNodes[0].childNodes[0].nodeValue.toUpperCase());
							preloadedMouseOvers.push(preloadTemp);
							
							eval("subNavList.childNodes[x].childNodes[0].onmouseover = function(){ this.childNodes[0].src='heading.php?font=CenturyGothic-Bold&font_size=7.5.25&font_color=000000&background_color=eae4cc&text="+encodeURI(subNavList.childNodes[x].childNodes[0].childNodes[0].nodeValue.toUpperCase())+"';}");
							eval("subNavList.childNodes[x].childNodes[0].onmouseout = function(){ this.childNodes[0].src='heading.php?font=CenturyGothic-Bold&font_size=7.5.25&font_color=000000&background_color=c0c0c0&text="+encodeURI(subNavList.childNodes[x].childNodes[0].childNodes[0].nodeValue.toUpperCase())+"';}");
						
						}
						
						
						subNavList.childNodes[x].childNodes[0].replaceChild(textImage,subNavList.childNodes[x].childNodes[0].childNodes[0]);
					}
				}

				var subContainer = document.createElement('div');
				subContainer.id = 'menu'+menuCount+'Container';

				

				
				var subContent = document.createElement('div');
				subContent.id = 'menu'+menuCount+'Content';
				subContent.className = 'menu';


				var subOptions = document.createElement('div');
				subOptions.className = 'options';
				subOptions.appendChild(subNavList);
				subContent.appendChild(subOptions)
				subContainer.appendChild(subContent);
				document.body.appendChild(subContainer);
				
					
				if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
					if ('undefined' == document['IEstyles'] + '') {
						document.createStyleSheet();
						document.IEstyles = document.styleSheets[document.styleSheets.length - 1];
					}
					document.IEstyles.addRule("#menu"+menuCount+"Container","visibility:hidden;left:"+(menuX +200)+"px;top:"+menuY+"px;overflow:hidden;position:absolute;width:"+menuW+"px;height:"+menuH+"px;clip:rect(0 "+menuW+ " "+ menuH + "0);z-index:50;");
					document.IEstyles.addRule("#menu"+menuCount+"Content","position:absolute;width:"+menuW+"px;height:"+menuH+"px;clip:rect(0 "+menuW+ " "+ menuH + "0);z-index:50;");
					
					
				}else if (document.createStyleSheet) {
					// THIS CODE IS FOR IE ONLY, AND WORKS FINE
					with (document.createStyleSheet()) {
						addRule("#menu"+menuCount+"Container","visibility:hidden;left:"+menuX+"px;top:"+menuY+"px;overflow:hidden;position:absolute;width:"+menuW+"px;height:"+menuH+"px;clip:rect(0 "+menuW+ " "+ menuH + "0);z-index:50;");
						addRule("#menu"+menuCount+"Content","position:absolute;width:"+menuW+"px;height:"+menuH+"px;clip:rect(0 "+menuW+ " "+ menuH + "0);z-index:50;");
						
					}
				}else{
					subContainer.style.visibility = 'hidden';
					subContainer.style.left = menuX+'px';
					subContainer.style.top = menuY+'px';
					subContainer.style.overflow = 'hidden';
					subContainer.style.position = 'absolute';
					subContainer.style.width = menuW+'px';
					subContainer.style.height = menuH+'px';
					subContainer.style.clip = 'rect(0 '+menuW+ ' '+ menuH + '0)';
					subContainer.style.zIndex = '50';
					
					subContent.style.position = 'absolute';
					subContent.style.width = menuW+'px';
					subContent.style.height = menuH+'px';
					subContent.style.clip = 'rect(0 '+menuW+ ' '+ menuH + '0)';
					subContent.style.zIndex = '50';
					
				}

				menuInstance = new ypSlideOutMenu('menu'+menuCount, 'down', menuX,menuY,menuW,menuH,50)
				menuInstance.onactivate = new Function("document.getElementById('act" + actCount + "').className='active';document.getElementById('act"+actCount+"textImage').src='heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=eae4cc&text="+obj.nodeValue.toUpperCase()+"'");
				menuInstance.ondeactivate = new Function("document.getElementById('act" + actCount + "').className='';document.getElementById('act"+actCount+"textImage').src='heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=84a5b1&text="+obj.nodeValue.toUpperCase()+"'");
				menuCount++;
				actCount++;
			}else{
				textImage = document.createElement('img');
				if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
					textImage.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=84a5b1&text="+escape(obj.nodeValue.toUpperCase());
				}else{
					textImage.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=84a5b1&text="+encodeURI(obj.nodeValue.toUpperCase());
				}
				textImage.align = 'top';
				textImage.id = 'link'+i+'textImage';
			//	link.onmouseover = function(){ ypSlideOutMenu.hideAll();}
			//	link.onmouseout = function(){ ypSlideOutMenu.hideAll();}
				
				preloadTemp = new Image();
				if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
					preloadTemp.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=eae4cc&text="+escape(obj.nodeValue.toUpperCase());
				}else{
					preloadTemp.src = "heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=eae4cc&text="+encodeURI(obj.nodeValue.toUpperCase());
				}
				if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
					// do nothing
				}else{
					preloadedMouseOvers.push(preloadTemp);
				}
				
				if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
					eval("link.onmouseover = function(){ ypSlideOutMenu.hideAll();document.getElementById('link"+i+"textImage').src='heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=eae4cc&text="+escape(obj.nodeValue.toUpperCase())+"';}");
					eval("link.onmouseout = function(){ ypSlideOutMenu.hideAll();document.getElementById('link"+i+"textImage').src='heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=84a5b1&text="+escape(obj.nodeValue.toUpperCase())+"';}");
				}else{
					eval("link.onmouseover = function(){ ypSlideOutMenu.hideAll();document.getElementById('link"+i+"textImage').src='heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=eae4cc&text="+encodeURI(obj.nodeValue.toUpperCase())+"';}");
					eval("link.onmouseout = function(){ ypSlideOutMenu.hideAll();document.getElementById('link"+i+"textImage').src='heading.php?font=CenturyGothic-Bold&font_size=7.5&font_color=000000&background_color=84a5b1&text="+encodeURI(obj.nodeValue.toUpperCase())+"';}");
				}
				
				//link.appendChild(linkText);
				link.appendChild(textImage);
				destDiv.appendChild(link);
			}			
		}
		
	}
	// we now hide the list now that we're done with it
	sourceList.style.display = 'none';
	// below is the syntax for calling this function
	// buildNav(sourceList,destDiv,menubarH,menuW,menuH)
	// makeTreesC();
	 /*  I was trying to reset the previously applied positioning.
	 It didn't work because of text-align:center ... The elements were being added and positions
	 calculated before everything had settled out.
	 */

	repositionMenus();
}

	  var imageLoadError = 0;
	 function checkMenuImages(){
		 var menubar = document.getElementById('menubar');
		 var menuAnchors = menubar.childNodes;
		 
		  for (x=0; x<menuAnchors.length; x++){
			  //if(menuAnchors[x].childNodes[0].offsetWidth > '0'){
			  if(menuAnchors[x].childNodes[0].complete == true) {
				 return true;
			  }else if( (browser == "Safari")  && (menuAnchors[x].childNodes[0].offsetWidth > '5') ){
				  return true;
			  }else{
				 imageLoadError++;
			  }
			 
		  }
		  if(imageLoadError > 0){
			   window.setTimeout(checkMenuImages, 500);
		  }
	 }
	 
	 function repositionMenus(){
		 if(checkMenuImages() == true){
			 for (x=0; x<menuCount-1; x++){
				 
				 
				 var tmpObj = eval("document.getElementById('act"+x+"')");
				 var newMenuX = getAnchorPosition('act'+x).x-5;
				 /* this -5 above is to account for a shadow
				 	I'm doing it only here because this function is called onmouseover anyway
					*/
				 
				// var newMenuY = getAnchorPosition('act'+x).y;
				 //alert(newMenuX);
				 if( (browser == 'Internet Explorer') && (OS == 'Mac') ){
					 if ('undefined' == document['IEstyles'] + '') {
						document.createStyleSheet();
						document.IEstyles = document.styleSheets[document.styleSheets.length - 1];
					}
					document.IEstyles.addRule("#menu"+(x+1)+"Container","left:"+newMenuX+"px;");
										 
				 }else if (document.createStyleSheet) {
				
					with (document.createStyleSheet()) {
						addRule("#menu"+(x+1)+"Container","left:"+newMenuX+"px;");
					}
					
				 }else{
					 eval("document.getElementById('menu"+(x+1)+"Container').style.left = '"+newMenuX+"px';");
				}
			 }
		 }else{
			 window.setTimeout(repositionMenus, 1000);
		 }
	 }

// onmousedown="this.src='pics/button_find_down.gif';" onfocus="this.blur();" 
function buttonBehavior(){
	var el = getElementsByClass(document,'button','input');
	for (x=0; x<el.length; x++){
		var im = new Image();
		eval("im.src='pics/button_"+el[x].value+"_down.gif';");
		el[x].onmousedown = function(){ this.src='pics/button_'+this.value+'_down.gif'; };
		el[x].onfocus = function(){ this.blur() }
	}
}



	/*              Utility functions                    */

function addEvent(obj, evType, fn){
  /* adds an eventListener for browsers which support it
     Written by Scott Andrew: nice one, Scott */
  if (obj.addEventListener){
    obj.addEventListener(evType, fn, true);
    return true;
  } else if (obj.attachEvent){
	var r = obj.attachEvent("on"+evType, fn);
    return r;
  } else {
	return false;
  }
}

function getElementsByClass(node,searchClass,tag) {
var classElements = new Array();
var els = node.getElementsByTagName(tag); // use "*" for all elements
var elsLen = els.length;
var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
	for (i = 0, j = 0; i < elsLen; i++) {
		if ( pattern.test(els[i].className) ) {
		classElements[j] = els[i];
		j++;
		}
	}
return classElements;
}

<!--}}}-->