/* ------------- drop down menu script Jan Carlson ------------ modified 19 September 2008 --------- */ // copyright Graf Web Design - Australia 2008 All rights reserved // // global variables var g_currentMOhandler=null; // stores button mouseover handler var g_currentMenu=null; // stores menu that is currently open var g_currentButton=null; // stores button that has just activated the menu var g_bkgrndElem=null; // stores ref to background object var g_oldImgSrc=null // stores ref to old image var g_boxList=new Array() // stores display [block] or not[none] info for each box g_boxList["box1"]="none"; g_boxList["box2"]="block"; g_boxList["box3"]="block"; // ------------------------------------------------- // initialise button handlers on loading the page [look in the tag below for the call to this function]. function init() { var i, elem; // apply event handler to each button for(i=1; i<4; i++) // <<<<<<<<<<<<< change this number to increase number of menus [buttons+1]. { elem=document.getElementById("ox"+i); elem.onmouseover=show; // passes event to function show() when written like this } } // // ---------------------------------------------- // When you hover over the nav button the mouseover handler on the button calls the // function "show()". The event is passed to the function, which allows you to // determine the object that called the event - which button in this case. // The button id's are named "ox1" and "ox2". By adding a "b"+"ox1" you get "box1" // which is the id of the menu. This allows you to make the correct menu visible. // You can add any number of menus by adding another

below // and increasing the number in the init() function. // function show(evt) { // -- check for outstanding menu being displayed -- if(g_currentMenu){ swch()}; // if it's there, clear it and cancel all storage by calling function swch() // // --- equalise events across IE and NS. evt is passed to this function by the mouseover event --- evt=(evt)?evt : ((window.event)?event : null) g_currentButton=(evt.target)? evt.target : evt.srcElement; // this is the button being hovered over // // ------- correction for bug in Netscape 7 ---- text node is selected. Swap between node and parent node, depending on browser g_currentButton=(g_currentButton.parentNode.nodeName=="TD")?g_currentButton.parentNode : g_currentButton; // // --- toggle button img colour on hover ---- g_oldImgSrc=g_currentButton.src; // // toggle for nav bar buttons on mouseover. Remember, no mouseout in this script, all done with bkgrnd. var slash=g_oldImgSrc.lastIndexOf("/")+1; var newSrcEnd; newSrcEnd=g_oldImgSrc.substr(slash).replace("nav1_","nav2_"); var newSrc=g_oldImgSrc.substr(0,slash)+newSrcEnd; g_currentButton.src=newSrc; // // get menu object and store as global current menu g_currentMenu=document.getElementById("b"+g_currentButton.id); // get reference to menu object eg: "b"+"ox1" // check if you want to display then display menu if allowed var showIt=g_boxList[g_currentMenu.id]; // g_currentMenu.style.display=showIt; // store current handler for later in global variable g_currentMOhandler=g_currentButton.onmouseover; // set the button MO handler to do nothing g_currentButton.onmouseover=null; // // set global background handler to active g_bkgrndElem=document.getElementById("bkgrnd"); // get reference to background object g_bkgrndElem.onmouseover=swch; // apply event handler // // set background zIndex over other objects but under buttons g_bkgrndElem.style.zIndex="10"; // return } // // -------------------------------------------- // // this function hides outstanding menus and clears all storage info // function swch() { // hide current menu g_currentMenu.style.display="none"; g_currentMenu=null; // // cancel background handler g_bkgrndElem.onmouseover=null; // set to do nothing // // toggle button image g_currentButton.src=g_oldImgSrc; g_oldImgSrc=null; // reset old button handler and cancel entries g_currentButton.onmouseover=g_currentMOhandler; g_currentButton=null; g_currentMOhandler=null; // // reset background zIndex g_bkgrndElem.style.zIndex="1"; } // ----------------------------------------------