// define menu attributes here var menuTimeoutLength = 200; var menuRestoreImageID = new Array(); var menuRestoreImagePath = new Array(); //number of pixels to shift down top menu from source element var topShift = 2; // shows the drop down menu // expected arg is active div var sourceElement; function showDDNav(divName,source,width,align,shift){ if (typeof source != "undefined") sourceElement = source; if (width == null || width == "") width = 200; if (align == null) align = "left"; if (shift == null || shift == "") shift = 0; if (typeof menuTimeout[divName] != "undefined") clearTimeout(menuTimeout[divName]) menuTimeout[divName] = setTimeout("showDDNav2('" + divName + "','" + align + "'," + shift + "," + width + ")",menuTimeoutLength); } function showDDNav2(divName,align,shift,width){ var divRef = document.getElementById(divName); if (!divRef) { divRef = createMenu(divName.substr(4),width,sourceElement); } if (divRef && divRef.style.visibility != "visible") { //Set top and left position for menu //Shift is used to line up outer menus with the left and right edges of the content area. if (typeof sourceElement != "undefined") { if (sourceElement.className == "topMenuItemMouseover") { var sourceMenu = sourceElement.parentNode; var sourceMenuTop = parseInt(sourceMenu.style.top); var sourceMenuBottom = sourceMenuTop + sourceMenu.offsetHeight; var newMenuTop = parseInt(sourceMenu.style.top) + sourceElement.offsetTop; var newMenuBottom = newMenuTop + divRef.offsetHeight; //make sure menu doesn't go lower than main menu, unless it has to if (newMenuBottom > sourceMenuBottom) { if (divRef.offsetHeight > sourceMenu.offsetHeight) { newMenuTop = sourceMenuTop; } else { newMenuTop = sourceMenuBottom - divRef.offsetHeight; } } divRef.style.top = newMenuTop + "px"; if (sourceMenu.getAttribute("menuAlign") == "left") { divRef.style.left = (parseInt(sourceElement.parentNode.style.left) + sourceElement.offsetWidth + 6) + "px"; } else { divRef.style.left = (parseInt(sourceElement.parentNode.style.left) - divRef.offsetWidth) + "px"; } } else { if (align == "left") { divRef.style.left = (_totalOffsetLeft(sourceElement) - shift) + "px"; } else { divRef.style.left = (_totalOffsetLeft(sourceElement) + sourceElement.offsetWidth - divRef.offsetWidth + shift) + "px"; } divRef.setAttribute("menuAlign",align); divRef.style.top = (_totalOffsetTop(sourceElement) + sourceElement.offsetHeight + topShift) + "px"; } } divRef.style.visibility = "visible"; _setSelectVisibility("hidden",divRef) } } // hides the drop down menu // expected arg is active div var lastRestoreImageID, lastRestoreImagePath; function hideDDNav(divName,restoreImageID,restoreImagePath){ if (typeof menuTimeout[divName] != "undefined") clearTimeout(menuTimeout[divName]); // If restore image not passed, then coming from menu and not main menu button. // Save restore image if passed, or use saved if not passed if (restoreImageID == null && menuRestoreImageID[divName]) { restoreImageID = menuRestoreImageID[divName]; } else { menuRestoreImageID[divName] = restoreImageID; } if (restoreImagePath == null && menuRestoreImagePath[divName]) { restoreImagePath = menuRestoreImagePath[divName]; } else { menuRestoreImagePath[divName] = restoreImagePath; } menuTimeout[divName] = setTimeout("hideDDNav2('" + divName + "','" + restoreImageID + "','" + restoreImagePath + "');",menuTimeoutLength); } function hideDDNav2(divName,restoreImageID,restoreImagePath){ var divRef = document.getElementById(divName); if(divRef && divRef.style.visibility=='visible'){ divRef.style.visibility = 'hidden'; _setSelectVisibility("visible",divRef) } MM_swapImage(restoreImageID,'',restoreImagePath,1); } // highlight menuitem in IE & NS6 // expected arg is active menuitem function itemOver(e){ itemDiv = getEventSrcElement(e); while (itemDiv.className != "topMenuItem") itemDiv = itemDiv.parentNode; if (itemDiv) { itemDiv.className="topMenuItemMouseover"; //keep showing this menu showDDNav(itemDiv.parentNode.id); //show submenu if (itemDiv.id.length > 1) { showDDNav("menu"+itemDiv.id.substr(1),itemDiv); } //keep showing parent menu if (itemDiv.parentNode.getAttribute("parentMenuID").indexOf("menu") == 0) { showDDNav(itemDiv.parentNode.getAttribute("parentMenuID")); } } } // highlight off menuitem in IE & NS6 // expected arg is active menuitem function itemOut(e){ itemDiv = getEventSrcElement(e); while (itemDiv.className != "topMenuItemMouseover") itemDiv = itemDiv.parentNode; if (itemDiv) { itemDiv.className="topMenuItem"; //hide this menu hideDDNav(itemDiv.parentNode.id); //hide submenu if (itemDiv.id.length > 1) { hideDDNav("menu"+itemDiv.id.substr(1)); } //hide parent menu if (itemDiv.parentNode.getAttribute("parentMenuID").indexOf("menu") == 0) { hideDDNav(itemDiv.parentNode.getAttribute("parentMenuID")); } } } // goes to specified url // expected arg is url function gotoUrl(e){ itemDiv = getEventSrcElement(e); while (itemDiv.className != "topMenuItemMouseover") itemDiv = itemDiv.parentNode; if (itemDiv.getAttribute("newWindow") && itemDiv.getAttribute("newWindow") == "1") { window.open(itemDiv.getAttribute("url")); } else { location.href = itemDiv.getAttribute("url"); } } // BUILD THE MENU IN IE & NETSCAPE 6 // expected args are 'div name','menu left coord','top in pixels (aka y-coord)',menu width function createMenu(menuID,menuWidth,sourceElement){ var divID = "menu"+menuID; var menuDiv,itemDiv,arrowDiv; //check ready state before creating menu //alert(document.readyState); if (!document.readyState || (document.readyState && document.readyState == "complete")) { if (menuData[menuID][0] != null) { //create menu div menuDiv = document.createElement("div"); menuDiv.id = divID; menuDiv.setAttribute("parentMenuID",sourceElement.parentNode.id); menuDiv.className = "topMenu"; menuDiv.style.width = menuWidth + "px"; menuDiv.setAttribute("onmouseover","showDDNav('"+divID+"')"); menuDiv.setAttribute("onmouseout","hideDDNav('"+divID+"')"); document.body.appendChild(menuDiv); // the loop below writes out each line of the menu. var y = 0; while (menuData[menuID][y] != null && menuData[menuID][y][0]!=null) { // the line below is the actual menu item. Notice that it uses the "dhtmlNav" stylesheet (in the default.css stylesheet file). I added  s to put spacing *inside* each menu item (whereas the innerWidth/outerWidth padding stuff would have added space *around* the menu items and highlights.) itemDiv = document.createElement("div"); // get submenu id, if available if (menuData[menuID][y].length > 3) { itemDiv.id = "x" + menuData[menuID][y][3]; } else { itemDiv.id = "x"; } itemDiv.className = "topMenuItem"; itemDiv.onmouseover = itemOver; itemDiv.onmouseout = itemOut; itemDiv.setAttribute("url",menuData[menuID][y][1]); itemDiv.setAttribute("newWindow",menuData[menuID][y][2]); itemDiv.onclick = gotoUrl; itemDiv.style.width = (menuWidth - 6) + "px"; // get submenu id, if available if (menuData[menuID][y].length > 3 && menuData[menuData[menuID][y][3]][0] != null) { itemDiv.id = "x" + menuData[menuID][y][3]; arrowDiv = document.createElement("div"); arrowDiv.className = "topMenuItemArrow"; arrowDiv.innerHTML = "\">\""; itemDiv.appendChild(arrowDiv); itemDiv.innerHTML += "
"+menuData[menuID][y][0]+"
"; } else { itemDiv.id = "x"; itemDiv.innerHTML = menuData[menuID][y][0]; } menuDiv.appendChild(itemDiv); y++; } } else { menuDiv = document.createElement("div"); document.body.appendChild(menuDiv); } } return menuDiv; } function getEventSrcElement(e) { if (window.event) { return window.event.srcElement; } else if (e && e.currentTarget) { return e.currentTarget; } } ///////////////////////////////////// //// Select objects are windowed and therefore don't obey the zIndex in IE (at least at the time of this writing) //// Therefore, they need to be hidden if they are in the way of an object. ///////////////////////////////////// function _setSelectVisibility(visibility,obj) { // get object position var oTop = _totalOffsetTop(obj); var oLeft = _totalOffsetLeft(obj); var oBottom = oTop + obj.offsetHeight; var oRight = oLeft + obj.offsetWidth; // loop through select objects var selectObjs = document.getElementsByTagName("SELECT"); for (var i = 0; i < selectObjs.length; i ++) { selectObj = selectObjs[i]; if (visibility == "hidden") { // get select object position var sTop = _totalOffsetTop(selectObj); var sLeft = _totalOffsetLeft(selectObj); var sBottom = sTop + selectObj.offsetHeight; var sRight = sLeft + selectObj.offsetWidth; // If select object overlaps menu, hide it. if (((oTop < sTop && sTop < oBottom) || (oTop < sBottom && sBottom < oBottom) || (sTop < oTop && sBottom > oBottom) || (sTop > oTop && sBottom < oBottom)) && ((oLeft < sLeft && sLeft < oRight) || (oLeft < sRight && sRight < oRight) || (sLeft < oLeft && sRight > oRight) || (sLeft > oLeft && sRight < oRight))) { selectObj.style.visibility = "hidden"; } } else { // Make sure all select objects are visible again. selectObj.style.visibility = "visible"; } } } function _totalOffsetLeft(el) { // Return the true x coordinate of an element relative to the page. return el.offsetLeft + (el.offsetParent ? _totalOffsetLeft(el.offsetParent) : 0); } function _totalOffsetTop(el) { // Return the true y coordinate of an element relative to the page. return el.offsetTop + (el.offsetParent ? _totalOffsetTop(el.offsetParent) : 0); } ///////////////////////////////////// // For the Rollover images in the menu function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i