blurredvision
asked on
Background Image on JS Dropdown (or flyout) menu
I'm trying to configure the following code to enable a background image for each MenuItem. The image is just a simple one-pixel wide by 20 pixels high gradient image that I want to tesselates across the width of the menu.
I know the code is DreamWeaver which is less than optimal, but I am on a bit of a deadline with this and would appreciate some assistance in making it work ASAP!
************************** ********** *
window.mm_menu_0307134031_ 0 = new Menu("root",124,17,"Verdan a, Arial, Helvetica, sans-serif",11,"#333366"," #FFFFFF"," #66CCFF"," #333366"," left","mid dle",3,0,1 000,-5,7,t rue,true,t rue,5,true ,true);
mm_menu_0307134031_0.addMe nuItem("Co mpany  ;Profile", "location= '?id=ea&ad =pr'");
mm_menu_0307134031_0.addMe nuItem("Vi sion Statement" ,"location ='?id=eb&a d=pr'");
mm_menu_0307134031_0.addMe nuItem("Ca reers","lo cation='?i d=ec&ad=bp '");
mm_menu_0307134031_0.addMe nuItem("Pr ess & Awar ds","locat ion='?id=e d&ad=pr'") ;
mm_menu_0307134031_0.fontW eight="bol d";
mm_menu_0307134031_0.hideO nMouseOut= true;
mm_menu_0307134031_0.bgCol or='#66CCF F';
mm_menu_0307134031_0.menuB order=2;
mm_menu_0307134031_0.menuL iteBgColor ='#66CCFF' ;
mm_menu_0307134031_0.menuB orderBgCol or='#66CCF F';
I know the code is DreamWeaver which is less than optimal, but I am on a bit of a deadline with this and would appreciate some assistance in making it work ASAP!
**************************
window.mm_menu_0307134031_
mm_menu_0307134031_0.addMe
mm_menu_0307134031_0.addMe
mm_menu_0307134031_0.addMe
mm_menu_0307134031_0.addMe
mm_menu_0307134031_0.fontW
mm_menu_0307134031_0.hideO
mm_menu_0307134031_0.bgCol
mm_menu_0307134031_0.menuB
mm_menu_0307134031_0.menuL
mm_menu_0307134031_0.menuB
send the full javascript code please
ASKER
Hi Designbai,
As requested, here's the full javascriptcode...
SCRIPT WITH NAV ELEMENTS EMBEDDED:
<script language="JavaScript">
<!--
function mmLoadMenus() {
if (window.mm_menu_0307124000 _0) return;
window.mm_menu_0307124000_ 0 = new Menu("root",140,21,"Verdan a, Arial, Helvetica, sans-serif",11,"#FFFFFF"," #F47443"," #F47443"," #333366"," left","mid dle",5,0,1 000,-5,7,t rue,true,t rue,5,true ,true);
mm_menu_0307124000_0.addMe nuItem("1" ,"location ='?id=ba&a d=pr'");
mm_menu_0307124000_0.addMe nuItem("2" ,"location ='?id=bb&a d=pr'");
mm_menu_0307124000_0.addMe nuItem("3" ,"location ='?id=bc&a d=pr'");
mm_menu_0307124000_0.addMe nuItem("4" ,"location ='?id=bd&a d=bp'");
mm_menu_0307124000_0.addMe nuItem("5s ","locatio n='?id=be& ad=pr'");
mm_menu_0307124000_0.fontW eight="bol d";
mm_menu_0307124000_0.hideO nMouseOut= true;
mm_menu_0307124000_0.bgIma ge='images /menu-bg.j pg';
mm_menu_0307124000_0.menuB order=2;
mm_menu_0307124000_0.menuL iteBgColor ='#FBF8F5' ;
mm_menu_0307124000_0.menuB orderBgCol or='#FBF8F 5';
window.mm_menu_0307134031_ 0 = new Menu("root",124,17,"Verdan a, Arial, Helvetica, sans-serif",11,"#333366"," #FFFFFF"," #66CCFF"," #333366"," left","mid dle",3,0,1 000,-5,7,t rue,true,t rue,5,true ,true);
mm_menu_0307134031_0.addMe nuItem("Co mpany  ;Profile", "location= '?id=ea&ad =pr'");
mm_menu_0307134031_0.addMe nuItem("Vi sion Statement" ,"location ='?id=eb&a d=pr'");
mm_menu_0307134031_0.addMe nuItem("Ca reers","lo cation='?i d=ec&ad=pr '");
mm_menu_0307134031_0.addMe nuItem("Pr ess & Awar ds","locat ion='?id=e d&ad=pr'") ;
mm_menu_0307134031_0.fontW eight="bol d";
mm_menu_0307134031_0.hideO nMouseOut= true;
mm_menu_0307134031_0.bgCol or='#66CCF F';
mm_menu_0307134031_0.menuB order=2;
mm_menu_0307134031_0.menuL iteBgColor ='#66CCFF' ;
mm_menu_0307134031_0.menuB orderBgCol or='#66CCF F';
mm_menu_0307134031_0.write Menus();
} // mmLoadMenus()
THEN SCRIPT FROM DREAMWEAVER GENERATED "mm_menu.js" FOLLOWS BELOW:
/**
* mm_menu 20MAR2002 Version 6.0
* Andy Finnell, March 2002
* Copyright (c) 2000-2002 Macromedia, Inc.
*
* based on menu.js
* by gary smith, July 1997
* Copyright (c) 1997-1999 Netscape Communications Corp.
*
* Netscape grants you a royalty free license to use or modify this
* software provided that this copyright notice appears on all copies.
* This software is provided "AS IS," without a warranty of any kind.
*/
function Menu(label, mw, mh, fnt, fs, fclr, fhclr, bg, bgh, halgn, valgn, pad, space, to, sx, sy, srel, opq, vert, idt, aw, ah)
{
this.version = "020320 [Menu; mm_menu.js]";
this.type = "Menu";
this.menuWidth = mw;
this.menuItemHeight = mh;
this.fontSize = fs;
this.fontWeight = "plain";
this.fontFamily = fnt;
this.fontColor = fclr;
this.fontColorHilite = fhclr;
this.bgColor = "#555555";
this.menuBorder = 1;
this.menuBgOpaque=opq;
this.menuItemBorder = 1;
this.menuItemIndent = idt;
this.menuItemBgColor = bg;
this.menuItemVAlign = valgn;
this.menuItemHAlign = halgn;
this.menuItemPadding = pad;
this.menuItemSpacing = space;
this.menuLiteBgColor = "#ffffff";
this.menuBorderBgColor = "#777777";
this.menuHiliteBgColor = bgh;
this.menuContainerBgColor = "#cccccc";
this.childMenuIcon = "arrows.gif";
this.submenuXOffset = sx;
this.submenuYOffset = sy;
this.submenuRelativeToItem = srel;
this.vertical = vert;
this.items = new Array();
this.actions = new Array();
this.childMenus = new Array();
this.hideOnMouseOut = true;
this.hideTimeout = to;
this.addMenuItem = addMenuItem;
this.writeMenus = writeMenus;
this.MM_showMenu = MM_showMenu;
this.onMenuItemOver = onMenuItemOver;
this.onMenuItemAction = onMenuItemAction;
this.hideMenu = hideMenu;
this.hideChildMenu = hideChildMenu;
if (!window.menus) window.menus = new Array();
this.label = " " + label;
window.menus[this.label] = this;
window.menus[window.menus. length] = this;
if (!window.activeMenus) window.activeMenus = new Array();
}
function addMenuItem(label, action) {
this.items[this.items.leng th] = label;
this.actions[this.actions. length] = action;
}
function FIND(item) {
if( window.mmIsOpera ) return(document.getElement ById(item) );
if (document.all) return(document.all[item]) ;
if (document.getElementById) return(document.getElement ById(item) );
return(false);
}
function writeMenus(container) {
if (window.triedToWriteMenus) return;
var agt = navigator.userAgent.toLowe rCase();
window.mmIsOpera = agt.indexOf("opera") != -1;
if (!container && document.layers) {
window.delayWriteMenus = this.writeMenus;
var timer = setTimeout('delayWriteMenu s()', 500);
container = new Layer(100);
clearTimeout(timer);
} else if (document.all || document.hasChildNodes || window.mmIsOpera) {
document.writeln('<span id="menuContainer"></span> ');
container = FIND("menuContainer");
}
window.mmHideMenuTimer = null;
if (!container) return;
window.triedToWriteMenus = true;
container.isContainer = true;
container.menus = new Array();
for (var i=0; i<window.menus.length; i++)
container.menus[i] = window.menus[i];
window.menus.length = 0;
var countMenus = 0;
var countItems = 0;
var top = 0;
var content = '';
var lrs = false;
var theStat = "";
var tsc = 0;
if (document.layers) lrs = true;
for (var i=0; i<container.menus.length; i++, countMenus++) {
var menu = container.menus[i];
if (menu.bgImageUp || !menu.menuBgOpaque) {
menu.menuBorder = 0;
menu.menuItemBorder = 0;
}
if (lrs) {
var menuLayer = new Layer(100, container);
var lite = new Layer(100, menuLayer);
lite.top = menu.menuBorder;
lite.left = menu.menuBorder;
var body = new Layer(100, lite);
body.top = menu.menuBorder;
body.left = menu.menuBorder;
} else {
content += ''+
'<div id="menuLayer'+ countMenus +'" style="position:absolute;z -index:1;l eft:10px;t op:'+ (i * 100) +'px;visibility:hidden;col or:' + menu.menuBorderBgColor + ';">\n'+
' <div id="menuLite'+ countMenus +'" style="position:absolute;z -index:1;l eft:'+ menu.menuBorder +'px;top:'+ menu.menuBorder +'px;visibility:hide;" onmouseout="mouseoutMenu() ;">\n'+
' <div id="menuFg'+ countMenus +'" style="position:absolute;l eft:'+ menu.menuBorder +'px;top:'+ menu.menuBorder +'px;visibility:hide;">\n' +
'';
}
var x=i;
for (var i=0; i<menu.items.length; i++) {
var item = menu.items[i];
var childMenu = false;
var defaultHeight = menu.fontSize+2*menu.menuI temPadding ;
if (item.label) {
item = item.label;
childMenu = true;
}
menu.menuItemHeight = menu.menuItemHeight || defaultHeight;
var itemProps = '';
if( menu.fontFamily != '' ) itemProps += 'font-family:' + menu.fontFamily +';';
itemProps += 'font-weight:' + menu.fontWeight + ';fontSize:' + menu.fontSize + 'px;';
if (menu.fontStyle) itemProps += 'font-style:' + menu.fontStyle + ';';
if (document.all || window.mmIsOpera)
itemProps += 'font-size:' + menu.fontSize + 'px;" onmouseover="onMenuItemOve r(null,thi s);" onclick="onMenuItemAction( null,this) ;';
else if (!document.layers) {
itemProps += 'font-size:' + menu.fontSize + 'px;';
}
var l;
if (lrs) {
var lw = menu.menuWidth;
if( menu.menuItemHAlign == 'right' ) lw -= menu.menuItemPadding;
l = new Layer(lw,body);
}
var itemLeft = 0;
var itemTop = i*menu.menuItemHeight;
if( !menu.vertical ) {
itemLeft = i*menu.menuWidth;
itemTop = 0;
}
var dTag = '<div id="menuItem'+ countItems +'" style="position:absolute;l eft:' + itemLeft + 'px;top:'+ itemTop +'px;'+ itemProps +'">';
var dClose = '</div>'
if (menu.bgImageUp) dTag = '<div id="menuItem'+ countItems +'" style="background:url('+me nu.bgImage Up+');posi tion:absol ute;left:' + itemLeft + 'px;top:'+ itemTop +'px;'+ itemProps +'">';
var left = 0, top = 0, right = 0, bottom = 0;
left = 1 + menu.menuItemPadding + menu.menuItemIndent;
right = left + menu.menuWidth - 2*menu.menuItemPadding - menu.menuItemIndent;
if( menu.menuItemVAlign == 'top' ) top = menu.menuItemPadding;
if( menu.menuItemVAlign == 'bottom' ) top = menu.menuItemHeight-menu.f ontSize-1- menu.menuI temPadding ;
if( menu.menuItemVAlign == 'middle' ) top = ((menu.menuItemHeight/2)-( menu.fontS ize/2)-1);
bottom = menu.menuItemHeight - 2*menu.menuItemPadding;
var textProps = 'position:absolute;left:' + left + 'px;top:' + top + 'px;';
if (lrs) {
textProps +=itemProps + 'right:' + right + ';bottom:' + bottom + ';';
dTag = "";
dClose = "";
}
if(document.all && !window.mmIsOpera) {
item = '<div align="' + menu.menuItemHAlign + '">' + item + '</div>';
} else if (lrs) {
item = '<div style="text-align:' + menu.menuItemHAlign + ';">' + item + '</div>';
} else {
var hitem = null;
if( menu.menuItemHAlign != 'left' ) {
if(window.mmIsOpera) {
var operaWidth = menu.menuItemHAlign == 'center' ? -(menu.menuWidth-2*menu.me nuItemPadd ing) : (menu.menuWidth-6*menu.men uItemPaddi ng);
hitem = '<div id="menuItemHilite' + countItems + 'Shim" style="position:absolute;t op:1px;lef t:' + menu.menuItemPadding + 'px;width:' + operaWidth + 'px;text-align:'
+ menu.menuItemHAlign + ';visibility:visible;">' + item + '</div>';
item = '<div id="menuItemText' + countItems + 'Shim" style="position:absolute;t op:1px;lef t:' + menu.menuItemPadding + 'px;width:' + operaWidth + 'px;text-align:'
+ menu.menuItemHAlign + ';visibility:visible;">' + item + '</div>';
} else {
hitem = '<div id="menuItemHilite' + countItems + 'Shim" style="position:absolute;t op:1px;lef t:1px;righ t:-' + (left+menu.menuWidth-3*men u.menuItem Padding) + 'px;text-align:'
+ menu.menuItemHAlign + ';visibility:visible;">' + item + '</div>';
item = '<div id="menuItemText' + countItems + 'Shim" style="position:absolute;t op:1px;lef t:1px;righ t:-' + (left+menu.menuWidth-3*men u.menuItem Padding) + 'px;text-align:'
+ menu.menuItemHAlign + ';visibility:visible;">' + item + '</div>';
}
} else hitem = null;
}
if(document.all && !window.mmIsOpera) item = '<div id="menuItemShim' + countItems + '" style="position:absolute;l eft:0px;to p:0px;">' + item + '</div>';
var dText = '<div id="menuItemText'+ countItems +'" style="' + textProps + 'color:'+ menu.fontColor +';">'+ item +' </div>\n'
+ '<div id="menuItemHilite'+ countItems +'" style="' + textProps + 'color:'+ menu.fontColorHilite +';visibility:hidden;">'
+ (hitem||item) +' </div>';
if (childMenu) content += ( dTag + dText + '<div id="childMenu'+ countItems +'" style="position:absolute;l eft:0px;to p:3px;"><i mg src="'+ menu.childMenuIcon +'"></div>\n' + dClose);
else content += ( dTag + dText + dClose);
if (lrs) {
l.document.open("text/html ");
l.document.writeln(content );
l.document.close();
content = '';
theStat += "-";
tsc++;
if (tsc > 50) {
tsc = 0;
theStat = "";
}
status = theStat;
}
countItems++;
}
if (lrs) {
var focusItem = new Layer(100, body);
focusItem.visiblity="hidde n";
focusItem.document.open("t ext/html") ;
focusItem.document.writeln (" ") ;
focusItem.document.close() ;
} else {
content += ' <div id="focusItem'+ countMenus +'" style="position:absolute;l eft:0px;to p:0px;visi bility:hid e;" onclick="onMenuItemAction( null,this) ;"> < /div>\n';
content += ' </div>\n </div>\n</div>\n';
}
i=x;
}
if (document.layers) {
container.clip.width = window.innerWidth;
container.clip.height = window.innerHeight;
container.onmouseout = mouseoutMenu;
container.menuContainerBgC olor = this.menuContainerBgColor;
for (var i=0; i<container.document.layer s.length; i++) {
proto = container.menus[i];
var menu = container.document.layers[ i];
container.menus[i].menuLay er = menu;
container.menus[i].menuLay er.Menu = container.menus[i];
container.menus[i].menuLay er.Menu.co ntainer = container;
var body = menu.document.layers[0].do cument.lay ers[0];
body.clip.width = proto.menuWidth || body.clip.width;
body.clip.height = proto.menuHeight || body.clip.height;
for (var n=0; n<body.document.layers.len gth-1; n++) {
var l = body.document.layers[n];
l.Menu = container.menus[i];
l.menuHiliteBgColor = proto.menuHiliteBgColor;
l.document.bgColor = proto.menuItemBgColor;
l.saveColor = proto.menuItemBgColor;
l.onmouseover = proto.onMenuItemOver;
l.onclick = proto.onMenuItemAction;
l.mmaction = container.menus[i].actions [n];
l.focusItem = body.document.layers[body. document.l ayers.leng th-1];
l.clip.width = proto.menuWidth || body.clip.width;
l.clip.height = proto.menuItemHeight || l.clip.height;
if (n>0) {
if( l.Menu.vertical ) l.top = body.document.layers[n-1]. top + body.document.layers[n-1]. clip.heigh t + proto.menuItemBorder + proto.menuItemSpacing;
else l.left = body.document.layers[n-1]. left + body.document.layers[n-1]. clip.width + proto.menuItemBorder + proto.menuItemSpacing;
}
l.hilite = l.document.layers[1];
if (proto.bgImageUp) l.background.src = proto.bgImageUp;
l.document.layers[1].isHil ite = true;
if (l.document.layers.length > 2) {
l.childMenu = container.menus[i].items[n ].menuLaye r;
l.document.layers[2].left = l.clip.width -13;
l.document.layers[2].top = (l.clip.height / 2) -4;
l.document.layers[2].clip. left += 3;
l.Menu.childMenus[l.Menu.c hildMenus. length] = l.childMenu;
}
}
if( proto.menuBgOpaque ) body.document.bgColor = proto.bgColor;
if( proto.vertical ) {
body.clip.width = l.clip.width +proto.menuBorder;
body.clip.height = l.top + l.clip.height +proto.menuBorder;
} else {
body.clip.height = l.clip.height +proto.menuBorder;
body.clip.width = l.left + l.clip.width +proto.menuBorder;
if( body.clip.width > window.innerWidth ) body.clip.width = window.innerWidth;
}
var focusItem = body.document.layers[n];
focusItem.clip.width = body.clip.width;
focusItem.Menu = l.Menu;
focusItem.top = -30;
focusItem.captureEvents(Ev ent.MOUSED OWN);
focusItem.onmousedown = onMenuItemDown;
if( proto.menuBgOpaque ) menu.document.bgColor = proto.menuBorderBgColor;
var lite = menu.document.layers[0];
if( proto.menuBgOpaque ) lite.document.bgColor = proto.menuLiteBgColor;
lite.clip.width = body.clip.width +1;
lite.clip.height = body.clip.height +1;
menu.clip.width = body.clip.width + (proto.menuBorder * 3) ;
menu.clip.height = body.clip.height + (proto.menuBorder * 3);
}
} else {
if ((!document.all) && (container.hasChildNodes) && !window.mmIsOpera) {
container.innerHTML=conten t;
} else {
container.document.open("t ext/html") ;
container.document.writeln (content);
container.document.close() ;
}
if (!FIND("menuLayer0")) return;
var menuCount = 0;
for (var x=0; x<container.menus.length; x++) {
var menuLayer = FIND("menuLayer" + x);
container.menus[x].menuLay er = "menuLayer" + x;
menuLayer.Menu = container.menus[x];
menuLayer.Menu.container = "menuLayer" + x;
menuLayer.style.zindex = 1;
var s = menuLayer.style;
s.pixeltop = -300;
s.pixelleft = -300;
s.top = '-300px';
s.left = '-300px';
var menu = container.menus[x];
menu.menuItemWidth = menu.menuWidth || menu.menuIEWidth || 140;
if( menu.menuBgOpaque ) menuLayer.style.background Color = menu.menuBorderBgColor;
var top = 0;
var left = 0;
menu.menuItemLayers = new Array();
for (var i=0; i<container.menus[x].items .length; i++) {
var l = FIND("menuItem" + menuCount);
l.Menu = container.menus[x];
l.Menu.menuItemLayers[l.Me nu.menuIte mLayers.le ngth] = l;
if (l.addEventListener || window.mmIsOpera) {
l.style.width = menu.menuItemWidth + 'px';
l.style.height = menu.menuItemHeight + 'px';
l.style.pixelWidth = menu.menuItemWidth;
l.style.pixelHeight = menu.menuItemHeight;
l.style.top = top + 'px';
l.style.left = left + 'px';
if(l.addEventListener) {
l.addEventListener("mouseo ver", onMenuItemOver, false);
l.addEventListener("click" , onMenuItemAction, false);
l.addEventListener("mouseo ut", mouseoutMenu, false);
}
if( menu.menuItemHAlign != 'left' ) {
l.hiliteShim = FIND("menuItemHilite" + menuCount + "Shim");
l.hiliteShim.style.visibil ity = "inherit";
l.textShim = FIND("menuItemText" + menuCount + "Shim");
l.hiliteShim.style.pixelWi dth = menu.menuItemWidth - 2*menu.menuItemPadding - menu.menuItemIndent;
l.hiliteShim.style.width = l.hiliteShim.style.pixelWi dth;
l.textShim.style.pixelWidt h = menu.menuItemWidth - 2*menu.menuItemPadding - menu.menuItemIndent;
l.textShim.style.width = l.textShim.style.pixelWidt h;
}
} else {
l.style.pixelWidth = menu.menuItemWidth;
l.style.pixelHeight = menu.menuItemHeight;
l.style.pixelTop = top;
l.style.pixelLeft = left;
if( menu.menuItemHAlign != 'left' ) {
var shim = FIND("menuItemShim" + menuCount);
shim[0].style.pixelWidth = menu.menuItemWidth - 2*menu.menuItemPadding - menu.menuItemIndent;
shim[1].style.pixelWidth = menu.menuItemWidth - 2*menu.menuItemPadding - menu.menuItemIndent;
shim[0].style.width = shim[0].style.pixelWidth + 'px';
shim[1].style.width = shim[1].style.pixelWidth + 'px';
}
}
if( menu.vertical ) top = top + menu.menuItemHeight+menu.m enuItemBor der+menu.m enuItemSpa cing;
else left = left + menu.menuItemWidth+menu.me nuItemBord er+menu.me nuItemSpac ing;
l.style.fontSize = menu.fontSize + 'px';
l.style.backgroundColor = menu.menuItemBgColor;
l.style.visibility = "inherit";
l.saveColor = menu.menuItemBgColor;
l.menuHiliteBgColor = menu.menuHiliteBgColor;
l.mmaction = container.menus[x].actions [i];
l.hilite = FIND("menuItemHilite" + menuCount);
l.focusItem = FIND("focusItem" + x);
l.focusItem.style.pixelTop = -30;
l.focusItem.style.top = '-30px';
var childItem = FIND("childMenu" + menuCount);
if (childItem) {
l.childMenu = container.menus[x].items[i ].menuLaye r;
childItem.style.pixelLeft = menu.menuItemWidth -11;
childItem.style.left = childItem.style.pixelLeft + 'px';
childItem.style.pixelTop = (menu.menuItemHeight /2) -4;
childItem.style.top = childItem.style.pixelTop + 'px';
l.Menu.childMenus[l.Menu.c hildMenus. length] = l.childMenu;
}
l.style.cursor = "hand";
menuCount++;
}
if( menu.vertical ) {
menu.menuHeight = top-1-menu.menuItemSpacing ;
menu.menuWidth = menu.menuItemWidth;
} else {
menu.menuHeight = menu.menuItemHeight;
menu.menuWidth = left-1-menu.menuItemSpacin g;
}
var lite = FIND("menuLite" + x);
var s = lite.style;
s.pixelHeight = menu.menuHeight +(menu.menuBorder * 2);
s.height = s.pixelHeight + 'px';
s.pixelWidth = menu.menuWidth + (menu.menuBorder * 2);
s.width = s.pixelWidth + 'px';
if( menu.menuBgOpaque ) s.backgroundColor = menu.menuLiteBgColor;
var body = FIND("menuFg" + x);
s = body.style;
s.pixelHeight = menu.menuHeight + menu.menuBorder;
s.height = s.pixelHeight + 'px';
s.pixelWidth = menu.menuWidth + menu.menuBorder;
s.width = s.pixelWidth + 'px';
if( menu.menuBgOpaque ) s.backgroundColor = menu.bgColor;
s = menuLayer.style;
s.pixelWidth = menu.menuWidth + (menu.menuBorder * 4);
s.width = s.pixelWidth + 'px';
s.pixelHeight = menu.menuHeight+(menu.menu Border*4);
s.height = s.pixelHeight + 'px';
}
}
if (document.captureEvents) document.captureEvents(Eve nt.MOUSEUP );
if (document.addEventListener ) document.addEventListener( "mouseup", onMenuItemOver, false);
if (document.layers && window.innerWidth) {
window.onresize = NS4resize;
window.NS4sIW = window.innerWidth;
window.NS4sIH = window.innerHeight;
setTimeout("NS4resize()",5 00);
}
document.onmouseup = mouseupMenu;
window.mmWroteMenu = true;
status = "";
}
function NS4resize() {
if (NS4sIW != window.innerWidth || NS4sIH != window.innerHeight) window.location.reload();
}
function onMenuItemOver(e, l) {
MM_clearTimeout();
l = l || this;
a = window.ActiveMenuItem;
if (document.layers) {
if (a) {
a.document.bgColor = a.saveColor;
if (a.hilite) a.hilite.visibility = "hidden";
if (a.Menu.bgImageOver) a.background.src = a.Menu.bgImageUp;
a.focusItem.top = -100;
a.clicked = false;
}
if (l.hilite) {
l.document.bgColor = l.menuHiliteBgColor;
l.zIndex = 1;
l.hilite.visibility = "inherit";
l.hilite.zIndex = 2;
l.document.layers[1].zInde x = 1;
l.focusItem.zIndex = this.zIndex +2;
}
if (l.Menu.bgImageOver) l.background.src = l.Menu.bgImageOver;
l.focusItem.top = this.top;
l.focusItem.left = this.left;
l.focusItem.clip.width = l.clip.width;
l.focusItem.clip.height = l.clip.height;
l.Menu.hideChildMenu(l);
} else if (l.style && l.Menu) {
if (a) {
a.style.backgroundColor = a.saveColor;
if (a.hilite) a.hilite.style.visibility = "hidden";
if (a.hiliteShim) a.hiliteShim.style.visibil ity = "inherit";
if (a.Menu.bgImageUp) a.style.background = "url(" + a.Menu.bgImageUp +")";;
}
l.style.backgroundColor = l.menuHiliteBgColor;
l.zIndex = 1;
if (l.Menu.bgImageOver) l.style.background = "url(" + l.Menu.bgImageOver +")";
if (l.hilite) {
l.hilite.style.visibility = "inherit";
if( l.hiliteShim ) l.hiliteShim.style.visibil ity = "visible";
}
l.focusItem.style.pixelTop = l.style.pixelTop;
l.focusItem.style.top = l.focusItem.style.pixelTop + 'px';
l.focusItem.style.pixelLef t = l.style.pixelLeft;
l.focusItem.style.left = l.focusItem.style.pixelLef t + 'px';
l.focusItem.style.zIndex = l.zIndex +1;
l.Menu.hideChildMenu(l);
} else return;
window.ActiveMenuItem = l;
}
function onMenuItemAction(e, l) {
l = window.ActiveMenuItem;
if (!l) return;
hideActiveMenus();
if (l.mmaction) eval("" + l.mmaction);
window.ActiveMenuItem = 0;
}
function MM_clearTimeout() {
if (mmHideMenuTimer) clearTimeout(mmHideMenuTim er);
mmHideMenuTimer = null;
mmDHFlag = false;
}
function MM_startTimeout() {
if( window.ActiveMenu ) {
mmStart = new Date();
mmDHFlag = true;
mmHideMenuTimer = setTimeout("mmDoHide()", window.ActiveMenu.Menu.hid eTimeout);
}
}
function mmDoHide() {
if (!mmDHFlag || !window.ActiveMenu) return;
var elapsed = new Date() - mmStart;
var timeout = window.ActiveMenu.Menu.hid eTimeout;
if (elapsed < timeout) {
mmHideMenuTimer = setTimeout("mmDoHide()", timeout+100-elapsed);
return;
}
mmDHFlag = false;
hideActiveMenus();
window.ActiveMenuItem = 0;
}
function MM_showMenu(menu, x, y, child, imgname) {
if (!window.mmWroteMenu) return;
MM_clearTimeout();
if (menu) {
var obj = FIND(imgname) || document.images[imgname] || document.links[imgname] || document.anchors[imgname];
x = moveXbySlicePos (x, obj);
y = moveYbySlicePos (y, obj);
}
if (document.layers) {
if (menu) {
var l = menu.menuLayer || menu;
l.top = l.left = 1;
hideActiveMenus();
if (this.visibility) l = this;
window.ActiveMenu = l;
} else {
var l = child;
}
if (!l) return;
for (var i=0; i<l.layers.length; i++) {
if (!l.layers[i].isHilite) l.layers[i].visibility = "inherit";
if (l.layers[i].document.laye rs.length > 0) MM_showMenu(null, "relative", "relative", l.layers[i]);
}
if (l.parentLayer) {
if (x != "relative") l.parentLayer.left = x || window.pageX || 0;
if (l.parentLayer.left + l.clip.width > window.innerWidth) l.parentLayer.left -= (l.parentLayer.left + l.clip.width - window.innerWidth);
if (y != "relative") l.parentLayer.top = y || window.pageY || 0;
if (l.parentLayer.isContainer ) {
l.Menu.xOffset = window.pageXOffset;
l.Menu.yOffset = window.pageYOffset;
l.parentLayer.clip.width = window.ActiveMenu.clip.wid th +2;
l.parentLayer.clip.height = window.ActiveMenu.clip.hei ght +2;
if (l.parentLayer.menuContain erBgColor && l.Menu.menuBgOpaque ) l.parentLayer.document.bgC olor = l.parentLayer.menuContaine rBgColor;
}
}
l.visibility = "inherit";
if (l.Menu) l.Menu.container.visibilit y = "inherit";
} else if (FIND("menuItem0")) {
var l = menu.menuLayer || menu;
hideActiveMenus();
if (typeof(l) == "string") l = FIND(l);
window.ActiveMenu = l;
var s = l.style;
s.visibility = "inherit";
if (x != "relative") {
s.pixelLeft = x || (window.pageX + document.body.scrollLeft) || 0;
s.left = s.pixelLeft + 'px';
}
if (y != "relative") {
s.pixelTop = y || (window.pageY + document.body.scrollTop) || 0;
s.top = s.pixelTop + 'px';
}
l.Menu.xOffset = document.body.scrollLeft;
l.Menu.yOffset = document.body.scrollTop;
}
if (menu) window.activeMenus[window. activeMenu s.length] = l;
MM_clearTimeout();
}
function onMenuItemDown(e, l) {
var a = window.ActiveMenuItem;
if (document.layers && a) {
a.eX = e.pageX;
a.eY = e.pageY;
a.clicked = true;
}
}
function mouseupMenu(e) {
hideMenu(true, e);
hideActiveMenus();
return true;
}
function getExplorerVersion() {
var ieVers = parseFloat(navigator.appVe rsion);
if( navigator.appName != 'Microsoft Internet Explorer' ) return ieVers;
var tempVers = navigator.appVersion;
var i = tempVers.indexOf( 'MSIE ' );
if( i >= 0 ) {
tempVers = tempVers.substring( i+5 );
ieVers = parseFloat( tempVers );
}
return ieVers;
}
function mouseoutMenu() {
if ((navigator.appName == "Microsoft Internet Explorer") && (getExplorerVersion() < 4.5))
return true;
hideMenu(false, false);
return true;
}
function hideMenu(mouseup, e) {
var a = window.ActiveMenuItem;
if (a && document.layers) {
a.document.bgColor = a.saveColor;
a.focusItem.top = -30;
if (a.hilite) a.hilite.visibility = "hidden";
if (mouseup && a.mmaction && a.clicked && window.ActiveMenu) {
if (a.eX <= e.pageX+15 && a.eX >= e.pageX-15 && a.eY <= e.pageY+10 && a.eY >= e.pageY-10) {
setTimeout('window.ActiveM enu.Menu.o nMenuItemA ction();', 500);
}
}
a.clicked = false;
if (a.Menu.bgImageOver) a.background.src = a.Menu.bgImageUp;
} else if (window.ActiveMenu && FIND("menuItem0")) {
if (a) {
a.style.backgroundColor = a.saveColor;
if (a.hilite) a.hilite.style.visibility = "hidden";
if (a.hiliteShim) a.hiliteShim.style.visibil ity = "inherit";
if (a.Menu.bgImageUp) a.style.background = "url(" + a.Menu.bgImageUp +")";
}
}
if (!mouseup && window.ActiveMenu) {
if (window.ActiveMenu.Menu) {
if (window.ActiveMenu.Menu.hi deOnMouseO ut) MM_startTimeout();
return(true);
}
}
return(true);
}
function hideChildMenu(hcmLayer) {
MM_clearTimeout();
var l = hcmLayer;
for (var i=0; i < l.Menu.childMenus.length; i++) {
var theLayer = l.Menu.childMenus[i];
if (document.layers) theLayer.visibility = "hidden";
else {
theLayer = FIND(theLayer);
theLayer.style.visibility = "hidden";
if( theLayer.Menu.menuItemHAli gn != 'left' ) {
for(var j = 0; j < theLayer.Menu.menuItemLaye rs.length; j++) {
var itemLayer = theLayer.Menu.menuItemLaye rs[j];
if(itemLayer.textShim) itemLayer.textShim.style.v isibility = "inherit";
}
}
}
theLayer.Menu.hideChildMen u(theLayer );
}
if (l.childMenu) {
var childMenu = l.childMenu;
if (document.layers) {
l.Menu.MM_showMenu(null,nu ll,null,ch ildMenu.la yers[0]);
childMenu.zIndex = l.parentLayer.zIndex +1;
childMenu.top = l.Menu.menuLayer.top + l.Menu.submenuYOffset;
if( l.Menu.vertical ) {
if( l.Menu.submenuRelativeToIt em ) childMenu.top += l.top + l.parentLayer.top;
childMenu.left = l.parentLayer.left + l.parentLayer.clip.width - (2*l.Menu.menuBorder) + l.Menu.menuLayer.left + l.Menu.submenuXOffset;
} else {
childMenu.top += l.top + l.parentLayer.top;
if( l.Menu.submenuRelativeToIt em ) childMenu.left = l.Menu.menuLayer.left + l.left + l.clip.width + (2*l.Menu.menuBorder) + l.Menu.submenuXOffset;
else childMenu.left = l.parentLayer.left + l.parentLayer.clip.width - (2*l.Menu.menuBorder) + l.Menu.menuLayer.left + l.Menu.submenuXOffset;
}
if( childMenu.left < l.Menu.container.clip.left ) l.Menu.container.clip.left = childMenu.left;
var w = childMenu.clip.width+child Menu.left- l.Menu.con tainer.cli p.left;
if (w > l.Menu.container.clip.widt h) l.Menu.container.clip.widt h = w;
var h = childMenu.clip.height+chil dMenu.top- l.Menu.con tainer.cli p.top;
if (h > l.Menu.container.clip.heig ht) l.Menu.container.clip.heig ht = h;
l.document.layers[1].zInde x = 0;
childMenu.visibility = "inherit";
} else if (FIND("menuItem0")) {
childMenu = FIND(l.childMenu);
var menuLayer = FIND(l.Menu.menuLayer);
var s = childMenu.style;
s.zIndex = menuLayer.style.zIndex+1;
if (document.all || window.mmIsOpera) {
s.pixelTop = menuLayer.style.pixelTop + l.Menu.submenuYOffset;
if( l.Menu.vertical ) {
if( l.Menu.submenuRelativeToIt em ) s.pixelTop += l.style.pixelTop;
s.pixelLeft = l.style.pixelWidth + menuLayer.style.pixelLeft + l.Menu.submenuXOffset;
s.left = s.pixelLeft + 'px';
} else {
s.pixelTop += l.style.pixelTop;
if( l.Menu.submenuRelativeToIt em ) s.pixelLeft = menuLayer.style.pixelLeft + l.style.pixelLeft + l.style.pixelWidth + (2*l.Menu.menuBorder) + l.Menu.submenuXOffset;
else s.pixelLeft = (menuLayer.style.pixelWidt h-4*l.Menu .menuBorde r) + menuLayer.style.pixelLeft + l.Menu.submenuXOffset;
s.left = s.pixelLeft + 'px';
}
} else {
var top = parseInt(menuLayer.style.t op) + l.Menu.submenuYOffset;
var left = 0;
if( l.Menu.vertical ) {
if( l.Menu.submenuRelativeToIt em ) top += parseInt(l.style.top);
left = (parseInt(menuLayer.style. width)-4*l .Menu.menu Border) + parseInt(menuLayer.style.l eft) + l.Menu.submenuXOffset;
} else {
top += parseInt(l.style.top);
if( l.Menu.submenuRelativeToIt em ) left = parseInt(menuLayer.style.l eft) + parseInt(l.style.left) + parseInt(l.style.width) + (2*l.Menu.menuBorder) + l.Menu.submenuXOffset;
else left = (parseInt(menuLayer.style. width)-4*l .Menu.menu Border) + parseInt(menuLayer.style.l eft) + l.Menu.submenuXOffset;
}
s.top = top + 'px';
s.left = left + 'px';
}
childMenu.style.visibility = "inherit";
} else return;
window.activeMenus[window. activeMenu s.length] = childMenu;
}
}
function hideActiveMenus() {
if (!window.activeMenus) return;
for (var i=0; i < window.activeMenus.length; i++) {
if (!activeMenus[i]) continue;
if (activeMenus[i].visibility && activeMenus[i].Menu && !window.mmIsOpera) {
activeMenus[i].visibility = "hidden";
activeMenus[i].Menu.contai ner.visibi lity = "hidden";
activeMenus[i].Menu.contai ner.clip.l eft = 0;
} else if (activeMenus[i].style) {
var s = activeMenus[i].style;
s.visibility = "hidden";
s.left = '-200px';
s.top = '-200px';
}
}
if (window.ActiveMenuItem) hideMenu(false, false);
window.activeMenus.length = 0;
}
function moveXbySlicePos (x, img) {
if (!document.layers) {
var onWindows = navigator.platform ? navigator.platform == "Win32" : false;
var macIE45 = document.all && !onWindows && getExplorerVersion() == 4.5;
var par = img;
var lastOffset = 0;
while(par){
if( par.leftMargin && ! onWindows ) x += parseInt(par.leftMargin);
if( (par.offsetLeft != lastOffset) && par.offsetLeft ) x += parseInt(par.offsetLeft);
if( par.offsetLeft != 0 ) lastOffset = par.offsetLeft;
par = macIE45 ? par.parentElement : par.offsetParent;
}
} else if (img.x) x += img.x;
return x;
}
function moveYbySlicePos (y, img) {
if(!document.layers) {
var onWindows = navigator.platform ? navigator.platform == "Win32" : false;
var macIE45 = document.all && !onWindows && getExplorerVersion() == 4.5;
var par = img;
var lastOffset = 0;
while(par){
if( par.topMargin && !onWindows ) y += parseInt(par.topMargin);
if( (par.offsetTop != lastOffset) && par.offsetTop ) y += parseInt(par.offsetTop);
if( par.offsetTop != 0 ) lastOffset = par.offsetTop;
par = macIE45 ? par.parentElement : par.offsetParent;
}
} else if (img.y >= 0) y += img.y;
return y;
}
As requested, here's the full javascriptcode...
SCRIPT WITH NAV ELEMENTS EMBEDDED:
<script language="JavaScript">
<!--
function mmLoadMenus() {
if (window.mm_menu_0307124000
window.mm_menu_0307124000_
mm_menu_0307124000_0.addMe
mm_menu_0307124000_0.addMe
mm_menu_0307124000_0.addMe
mm_menu_0307124000_0.addMe
mm_menu_0307124000_0.addMe
mm_menu_0307124000_0.fontW
mm_menu_0307124000_0.hideO
mm_menu_0307124000_0.bgIma
mm_menu_0307124000_0.menuB
mm_menu_0307124000_0.menuL
mm_menu_0307124000_0.menuB
window.mm_menu_0307134031_
mm_menu_0307134031_0.addMe
mm_menu_0307134031_0.addMe
mm_menu_0307134031_0.addMe
mm_menu_0307134031_0.addMe
mm_menu_0307134031_0.fontW
mm_menu_0307134031_0.hideO
mm_menu_0307134031_0.bgCol
mm_menu_0307134031_0.menuB
mm_menu_0307134031_0.menuL
mm_menu_0307134031_0.menuB
mm_menu_0307134031_0.write
} // mmLoadMenus()
THEN SCRIPT FROM DREAMWEAVER GENERATED "mm_menu.js" FOLLOWS BELOW:
/**
* mm_menu 20MAR2002 Version 6.0
* Andy Finnell, March 2002
* Copyright (c) 2000-2002 Macromedia, Inc.
*
* based on menu.js
* by gary smith, July 1997
* Copyright (c) 1997-1999 Netscape Communications Corp.
*
* Netscape grants you a royalty free license to use or modify this
* software provided that this copyright notice appears on all copies.
* This software is provided "AS IS," without a warranty of any kind.
*/
function Menu(label, mw, mh, fnt, fs, fclr, fhclr, bg, bgh, halgn, valgn, pad, space, to, sx, sy, srel, opq, vert, idt, aw, ah)
{
this.version = "020320 [Menu; mm_menu.js]";
this.type = "Menu";
this.menuWidth = mw;
this.menuItemHeight = mh;
this.fontSize = fs;
this.fontWeight = "plain";
this.fontFamily = fnt;
this.fontColor = fclr;
this.fontColorHilite = fhclr;
this.bgColor = "#555555";
this.menuBorder = 1;
this.menuBgOpaque=opq;
this.menuItemBorder = 1;
this.menuItemIndent = idt;
this.menuItemBgColor = bg;
this.menuItemVAlign = valgn;
this.menuItemHAlign = halgn;
this.menuItemPadding = pad;
this.menuItemSpacing = space;
this.menuLiteBgColor = "#ffffff";
this.menuBorderBgColor = "#777777";
this.menuHiliteBgColor = bgh;
this.menuContainerBgColor = "#cccccc";
this.childMenuIcon = "arrows.gif";
this.submenuXOffset = sx;
this.submenuYOffset = sy;
this.submenuRelativeToItem
this.vertical = vert;
this.items = new Array();
this.actions = new Array();
this.childMenus = new Array();
this.hideOnMouseOut = true;
this.hideTimeout = to;
this.addMenuItem = addMenuItem;
this.writeMenus = writeMenus;
this.MM_showMenu = MM_showMenu;
this.onMenuItemOver = onMenuItemOver;
this.onMenuItemAction = onMenuItemAction;
this.hideMenu = hideMenu;
this.hideChildMenu = hideChildMenu;
if (!window.menus) window.menus = new Array();
this.label = " " + label;
window.menus[this.label] = this;
window.menus[window.menus.
if (!window.activeMenus) window.activeMenus = new Array();
}
function addMenuItem(label, action) {
this.items[this.items.leng
this.actions[this.actions.
}
function FIND(item) {
if( window.mmIsOpera ) return(document.getElement
if (document.all) return(document.all[item])
if (document.getElementById) return(document.getElement
return(false);
}
function writeMenus(container) {
if (window.triedToWriteMenus)
var agt = navigator.userAgent.toLowe
window.mmIsOpera = agt.indexOf("opera") != -1;
if (!container && document.layers) {
window.delayWriteMenus = this.writeMenus;
var timer = setTimeout('delayWriteMenu
container = new Layer(100);
clearTimeout(timer);
} else if (document.all || document.hasChildNodes || window.mmIsOpera) {
document.writeln('<span id="menuContainer"></span>
container = FIND("menuContainer");
}
window.mmHideMenuTimer = null;
if (!container) return;
window.triedToWriteMenus = true;
container.isContainer = true;
container.menus = new Array();
for (var i=0; i<window.menus.length; i++)
container.menus[i] = window.menus[i];
window.menus.length = 0;
var countMenus = 0;
var countItems = 0;
var top = 0;
var content = '';
var lrs = false;
var theStat = "";
var tsc = 0;
if (document.layers) lrs = true;
for (var i=0; i<container.menus.length; i++, countMenus++) {
var menu = container.menus[i];
if (menu.bgImageUp || !menu.menuBgOpaque) {
menu.menuBorder = 0;
menu.menuItemBorder = 0;
}
if (lrs) {
var menuLayer = new Layer(100, container);
var lite = new Layer(100, menuLayer);
lite.top = menu.menuBorder;
lite.left = menu.menuBorder;
var body = new Layer(100, lite);
body.top = menu.menuBorder;
body.left = menu.menuBorder;
} else {
content += ''+
'<div id="menuLayer'+ countMenus +'" style="position:absolute;z
' <div id="menuLite'+ countMenus +'" style="position:absolute;z
' <div id="menuFg'+ countMenus +'" style="position:absolute;l
'';
}
var x=i;
for (var i=0; i<menu.items.length; i++) {
var item = menu.items[i];
var childMenu = false;
var defaultHeight = menu.fontSize+2*menu.menuI
if (item.label) {
item = item.label;
childMenu = true;
}
menu.menuItemHeight = menu.menuItemHeight || defaultHeight;
var itemProps = '';
if( menu.fontFamily != '' ) itemProps += 'font-family:' + menu.fontFamily +';';
itemProps += 'font-weight:' + menu.fontWeight + ';fontSize:' + menu.fontSize + 'px;';
if (menu.fontStyle) itemProps += 'font-style:' + menu.fontStyle + ';';
if (document.all || window.mmIsOpera)
itemProps += 'font-size:' + menu.fontSize + 'px;" onmouseover="onMenuItemOve
else if (!document.layers) {
itemProps += 'font-size:' + menu.fontSize + 'px;';
}
var l;
if (lrs) {
var lw = menu.menuWidth;
if( menu.menuItemHAlign == 'right' ) lw -= menu.menuItemPadding;
l = new Layer(lw,body);
}
var itemLeft = 0;
var itemTop = i*menu.menuItemHeight;
if( !menu.vertical ) {
itemLeft = i*menu.menuWidth;
itemTop = 0;
}
var dTag = '<div id="menuItem'+ countItems +'" style="position:absolute;l
var dClose = '</div>'
if (menu.bgImageUp) dTag = '<div id="menuItem'+ countItems +'" style="background:url('+me
var left = 0, top = 0, right = 0, bottom = 0;
left = 1 + menu.menuItemPadding + menu.menuItemIndent;
right = left + menu.menuWidth - 2*menu.menuItemPadding - menu.menuItemIndent;
if( menu.menuItemVAlign == 'top' ) top = menu.menuItemPadding;
if( menu.menuItemVAlign == 'bottom' ) top = menu.menuItemHeight-menu.f
if( menu.menuItemVAlign == 'middle' ) top = ((menu.menuItemHeight/2)-(
bottom = menu.menuItemHeight - 2*menu.menuItemPadding;
var textProps = 'position:absolute;left:' + left + 'px;top:' + top + 'px;';
if (lrs) {
textProps +=itemProps + 'right:' + right + ';bottom:' + bottom + ';';
dTag = "";
dClose = "";
}
if(document.all && !window.mmIsOpera) {
item = '<div align="' + menu.menuItemHAlign + '">' + item + '</div>';
} else if (lrs) {
item = '<div style="text-align:' + menu.menuItemHAlign + ';">' + item + '</div>';
} else {
var hitem = null;
if( menu.menuItemHAlign != 'left' ) {
if(window.mmIsOpera) {
var operaWidth = menu.menuItemHAlign == 'center' ? -(menu.menuWidth-2*menu.me
hitem = '<div id="menuItemHilite' + countItems + 'Shim" style="position:absolute;t
+ menu.menuItemHAlign + ';visibility:visible;">' + item + '</div>';
item = '<div id="menuItemText' + countItems + 'Shim" style="position:absolute;t
+ menu.menuItemHAlign + ';visibility:visible;">' + item + '</div>';
} else {
hitem = '<div id="menuItemHilite' + countItems + 'Shim" style="position:absolute;t
+ menu.menuItemHAlign + ';visibility:visible;">' + item + '</div>';
item = '<div id="menuItemText' + countItems + 'Shim" style="position:absolute;t
+ menu.menuItemHAlign + ';visibility:visible;">' + item + '</div>';
}
} else hitem = null;
}
if(document.all && !window.mmIsOpera) item = '<div id="menuItemShim' + countItems + '" style="position:absolute;l
var dText = '<div id="menuItemText'+ countItems +'" style="' + textProps + 'color:'+ menu.fontColor +';">'+ item +' </div>\n'
+ '<div id="menuItemHilite'+ countItems +'" style="' + textProps + 'color:'+ menu.fontColorHilite +';visibility:hidden;">'
+ (hitem||item) +' </div>';
if (childMenu) content += ( dTag + dText + '<div id="childMenu'+ countItems +'" style="position:absolute;l
else content += ( dTag + dText + dClose);
if (lrs) {
l.document.open("text/html
l.document.writeln(content
l.document.close();
content = '';
theStat += "-";
tsc++;
if (tsc > 50) {
tsc = 0;
theStat = "";
}
status = theStat;
}
countItems++;
}
if (lrs) {
var focusItem = new Layer(100, body);
focusItem.visiblity="hidde
focusItem.document.open("t
focusItem.document.writeln
focusItem.document.close()
} else {
content += ' <div id="focusItem'+ countMenus +'" style="position:absolute;l
content += ' </div>\n </div>\n</div>\n';
}
i=x;
}
if (document.layers) {
container.clip.width = window.innerWidth;
container.clip.height = window.innerHeight;
container.onmouseout = mouseoutMenu;
container.menuContainerBgC
for (var i=0; i<container.document.layer
proto = container.menus[i];
var menu = container.document.layers[
container.menus[i].menuLay
container.menus[i].menuLay
container.menus[i].menuLay
var body = menu.document.layers[0].do
body.clip.width = proto.menuWidth || body.clip.width;
body.clip.height = proto.menuHeight || body.clip.height;
for (var n=0; n<body.document.layers.len
var l = body.document.layers[n];
l.Menu = container.menus[i];
l.menuHiliteBgColor = proto.menuHiliteBgColor;
l.document.bgColor = proto.menuItemBgColor;
l.saveColor = proto.menuItemBgColor;
l.onmouseover = proto.onMenuItemOver;
l.onclick = proto.onMenuItemAction;
l.mmaction = container.menus[i].actions
l.focusItem = body.document.layers[body.
l.clip.width = proto.menuWidth || body.clip.width;
l.clip.height = proto.menuItemHeight || l.clip.height;
if (n>0) {
if( l.Menu.vertical ) l.top = body.document.layers[n-1].
else l.left = body.document.layers[n-1].
}
l.hilite = l.document.layers[1];
if (proto.bgImageUp) l.background.src = proto.bgImageUp;
l.document.layers[1].isHil
if (l.document.layers.length > 2) {
l.childMenu = container.menus[i].items[n
l.document.layers[2].left = l.clip.width -13;
l.document.layers[2].top = (l.clip.height / 2) -4;
l.document.layers[2].clip.
l.Menu.childMenus[l.Menu.c
}
}
if( proto.menuBgOpaque ) body.document.bgColor = proto.bgColor;
if( proto.vertical ) {
body.clip.width = l.clip.width +proto.menuBorder;
body.clip.height = l.top + l.clip.height +proto.menuBorder;
} else {
body.clip.height = l.clip.height +proto.menuBorder;
body.clip.width = l.left + l.clip.width +proto.menuBorder;
if( body.clip.width > window.innerWidth ) body.clip.width = window.innerWidth;
}
var focusItem = body.document.layers[n];
focusItem.clip.width = body.clip.width;
focusItem.Menu = l.Menu;
focusItem.top = -30;
focusItem.captureEvents(Ev
focusItem.onmousedown = onMenuItemDown;
if( proto.menuBgOpaque ) menu.document.bgColor = proto.menuBorderBgColor;
var lite = menu.document.layers[0];
if( proto.menuBgOpaque ) lite.document.bgColor = proto.menuLiteBgColor;
lite.clip.width = body.clip.width +1;
lite.clip.height = body.clip.height +1;
menu.clip.width = body.clip.width + (proto.menuBorder * 3) ;
menu.clip.height = body.clip.height + (proto.menuBorder * 3);
}
} else {
if ((!document.all) && (container.hasChildNodes) && !window.mmIsOpera) {
container.innerHTML=conten
} else {
container.document.open("t
container.document.writeln
container.document.close()
}
if (!FIND("menuLayer0")) return;
var menuCount = 0;
for (var x=0; x<container.menus.length; x++) {
var menuLayer = FIND("menuLayer" + x);
container.menus[x].menuLay
menuLayer.Menu = container.menus[x];
menuLayer.Menu.container = "menuLayer" + x;
menuLayer.style.zindex = 1;
var s = menuLayer.style;
s.pixeltop = -300;
s.pixelleft = -300;
s.top = '-300px';
s.left = '-300px';
var menu = container.menus[x];
menu.menuItemWidth = menu.menuWidth || menu.menuIEWidth || 140;
if( menu.menuBgOpaque ) menuLayer.style.background
var top = 0;
var left = 0;
menu.menuItemLayers = new Array();
for (var i=0; i<container.menus[x].items
var l = FIND("menuItem" + menuCount);
l.Menu = container.menus[x];
l.Menu.menuItemLayers[l.Me
if (l.addEventListener || window.mmIsOpera) {
l.style.width = menu.menuItemWidth + 'px';
l.style.height = menu.menuItemHeight + 'px';
l.style.pixelWidth = menu.menuItemWidth;
l.style.pixelHeight = menu.menuItemHeight;
l.style.top = top + 'px';
l.style.left = left + 'px';
if(l.addEventListener) {
l.addEventListener("mouseo
l.addEventListener("click"
l.addEventListener("mouseo
}
if( menu.menuItemHAlign != 'left' ) {
l.hiliteShim = FIND("menuItemHilite" + menuCount + "Shim");
l.hiliteShim.style.visibil
l.textShim = FIND("menuItemText" + menuCount + "Shim");
l.hiliteShim.style.pixelWi
l.hiliteShim.style.width = l.hiliteShim.style.pixelWi
l.textShim.style.pixelWidt
l.textShim.style.width = l.textShim.style.pixelWidt
}
} else {
l.style.pixelWidth = menu.menuItemWidth;
l.style.pixelHeight = menu.menuItemHeight;
l.style.pixelTop = top;
l.style.pixelLeft = left;
if( menu.menuItemHAlign != 'left' ) {
var shim = FIND("menuItemShim" + menuCount);
shim[0].style.pixelWidth = menu.menuItemWidth - 2*menu.menuItemPadding - menu.menuItemIndent;
shim[1].style.pixelWidth = menu.menuItemWidth - 2*menu.menuItemPadding - menu.menuItemIndent;
shim[0].style.width = shim[0].style.pixelWidth + 'px';
shim[1].style.width = shim[1].style.pixelWidth + 'px';
}
}
if( menu.vertical ) top = top + menu.menuItemHeight+menu.m
else left = left + menu.menuItemWidth+menu.me
l.style.fontSize = menu.fontSize + 'px';
l.style.backgroundColor = menu.menuItemBgColor;
l.style.visibility = "inherit";
l.saveColor = menu.menuItemBgColor;
l.menuHiliteBgColor = menu.menuHiliteBgColor;
l.mmaction = container.menus[x].actions
l.hilite = FIND("menuItemHilite" + menuCount);
l.focusItem = FIND("focusItem" + x);
l.focusItem.style.pixelTop
l.focusItem.style.top = '-30px';
var childItem = FIND("childMenu" + menuCount);
if (childItem) {
l.childMenu = container.menus[x].items[i
childItem.style.pixelLeft = menu.menuItemWidth -11;
childItem.style.left = childItem.style.pixelLeft + 'px';
childItem.style.pixelTop = (menu.menuItemHeight /2) -4;
childItem.style.top = childItem.style.pixelTop + 'px';
l.Menu.childMenus[l.Menu.c
}
l.style.cursor = "hand";
menuCount++;
}
if( menu.vertical ) {
menu.menuHeight = top-1-menu.menuItemSpacing
menu.menuWidth = menu.menuItemWidth;
} else {
menu.menuHeight = menu.menuItemHeight;
menu.menuWidth = left-1-menu.menuItemSpacin
}
var lite = FIND("menuLite" + x);
var s = lite.style;
s.pixelHeight = menu.menuHeight +(menu.menuBorder * 2);
s.height = s.pixelHeight + 'px';
s.pixelWidth = menu.menuWidth + (menu.menuBorder * 2);
s.width = s.pixelWidth + 'px';
if( menu.menuBgOpaque ) s.backgroundColor = menu.menuLiteBgColor;
var body = FIND("menuFg" + x);
s = body.style;
s.pixelHeight = menu.menuHeight + menu.menuBorder;
s.height = s.pixelHeight + 'px';
s.pixelWidth = menu.menuWidth + menu.menuBorder;
s.width = s.pixelWidth + 'px';
if( menu.menuBgOpaque ) s.backgroundColor = menu.bgColor;
s = menuLayer.style;
s.pixelWidth = menu.menuWidth + (menu.menuBorder * 4);
s.width = s.pixelWidth + 'px';
s.pixelHeight = menu.menuHeight+(menu.menu
s.height = s.pixelHeight + 'px';
}
}
if (document.captureEvents) document.captureEvents(Eve
if (document.addEventListener
if (document.layers && window.innerWidth) {
window.onresize = NS4resize;
window.NS4sIW = window.innerWidth;
window.NS4sIH = window.innerHeight;
setTimeout("NS4resize()",5
}
document.onmouseup = mouseupMenu;
window.mmWroteMenu = true;
status = "";
}
function NS4resize() {
if (NS4sIW != window.innerWidth || NS4sIH != window.innerHeight) window.location.reload();
}
function onMenuItemOver(e, l) {
MM_clearTimeout();
l = l || this;
a = window.ActiveMenuItem;
if (document.layers) {
if (a) {
a.document.bgColor = a.saveColor;
if (a.hilite) a.hilite.visibility = "hidden";
if (a.Menu.bgImageOver) a.background.src = a.Menu.bgImageUp;
a.focusItem.top = -100;
a.clicked = false;
}
if (l.hilite) {
l.document.bgColor = l.menuHiliteBgColor;
l.zIndex = 1;
l.hilite.visibility = "inherit";
l.hilite.zIndex = 2;
l.document.layers[1].zInde
l.focusItem.zIndex = this.zIndex +2;
}
if (l.Menu.bgImageOver) l.background.src = l.Menu.bgImageOver;
l.focusItem.top = this.top;
l.focusItem.left = this.left;
l.focusItem.clip.width = l.clip.width;
l.focusItem.clip.height = l.clip.height;
l.Menu.hideChildMenu(l);
} else if (l.style && l.Menu) {
if (a) {
a.style.backgroundColor = a.saveColor;
if (a.hilite) a.hilite.style.visibility = "hidden";
if (a.hiliteShim) a.hiliteShim.style.visibil
if (a.Menu.bgImageUp) a.style.background = "url(" + a.Menu.bgImageUp +")";;
}
l.style.backgroundColor = l.menuHiliteBgColor;
l.zIndex = 1;
if (l.Menu.bgImageOver) l.style.background = "url(" + l.Menu.bgImageOver +")";
if (l.hilite) {
l.hilite.style.visibility = "inherit";
if( l.hiliteShim ) l.hiliteShim.style.visibil
}
l.focusItem.style.pixelTop
l.focusItem.style.top = l.focusItem.style.pixelTop
l.focusItem.style.pixelLef
l.focusItem.style.left = l.focusItem.style.pixelLef
l.focusItem.style.zIndex = l.zIndex +1;
l.Menu.hideChildMenu(l);
} else return;
window.ActiveMenuItem = l;
}
function onMenuItemAction(e, l) {
l = window.ActiveMenuItem;
if (!l) return;
hideActiveMenus();
if (l.mmaction) eval("" + l.mmaction);
window.ActiveMenuItem = 0;
}
function MM_clearTimeout() {
if (mmHideMenuTimer) clearTimeout(mmHideMenuTim
mmHideMenuTimer = null;
mmDHFlag = false;
}
function MM_startTimeout() {
if( window.ActiveMenu ) {
mmStart = new Date();
mmDHFlag = true;
mmHideMenuTimer = setTimeout("mmDoHide()", window.ActiveMenu.Menu.hid
}
}
function mmDoHide() {
if (!mmDHFlag || !window.ActiveMenu) return;
var elapsed = new Date() - mmStart;
var timeout = window.ActiveMenu.Menu.hid
if (elapsed < timeout) {
mmHideMenuTimer = setTimeout("mmDoHide()", timeout+100-elapsed);
return;
}
mmDHFlag = false;
hideActiveMenus();
window.ActiveMenuItem = 0;
}
function MM_showMenu(menu, x, y, child, imgname) {
if (!window.mmWroteMenu) return;
MM_clearTimeout();
if (menu) {
var obj = FIND(imgname) || document.images[imgname] || document.links[imgname] || document.anchors[imgname];
x = moveXbySlicePos (x, obj);
y = moveYbySlicePos (y, obj);
}
if (document.layers) {
if (menu) {
var l = menu.menuLayer || menu;
l.top = l.left = 1;
hideActiveMenus();
if (this.visibility) l = this;
window.ActiveMenu = l;
} else {
var l = child;
}
if (!l) return;
for (var i=0; i<l.layers.length; i++) {
if (!l.layers[i].isHilite) l.layers[i].visibility = "inherit";
if (l.layers[i].document.laye
}
if (l.parentLayer) {
if (x != "relative") l.parentLayer.left = x || window.pageX || 0;
if (l.parentLayer.left + l.clip.width > window.innerWidth) l.parentLayer.left -= (l.parentLayer.left + l.clip.width - window.innerWidth);
if (y != "relative") l.parentLayer.top = y || window.pageY || 0;
if (l.parentLayer.isContainer
l.Menu.xOffset = window.pageXOffset;
l.Menu.yOffset = window.pageYOffset;
l.parentLayer.clip.width = window.ActiveMenu.clip.wid
l.parentLayer.clip.height = window.ActiveMenu.clip.hei
if (l.parentLayer.menuContain
}
}
l.visibility = "inherit";
if (l.Menu) l.Menu.container.visibilit
} else if (FIND("menuItem0")) {
var l = menu.menuLayer || menu;
hideActiveMenus();
if (typeof(l) == "string") l = FIND(l);
window.ActiveMenu = l;
var s = l.style;
s.visibility = "inherit";
if (x != "relative") {
s.pixelLeft = x || (window.pageX + document.body.scrollLeft) || 0;
s.left = s.pixelLeft + 'px';
}
if (y != "relative") {
s.pixelTop = y || (window.pageY + document.body.scrollTop) || 0;
s.top = s.pixelTop + 'px';
}
l.Menu.xOffset = document.body.scrollLeft;
l.Menu.yOffset = document.body.scrollTop;
}
if (menu) window.activeMenus[window.
MM_clearTimeout();
}
function onMenuItemDown(e, l) {
var a = window.ActiveMenuItem;
if (document.layers && a) {
a.eX = e.pageX;
a.eY = e.pageY;
a.clicked = true;
}
}
function mouseupMenu(e) {
hideMenu(true, e);
hideActiveMenus();
return true;
}
function getExplorerVersion() {
var ieVers = parseFloat(navigator.appVe
if( navigator.appName != 'Microsoft Internet Explorer' ) return ieVers;
var tempVers = navigator.appVersion;
var i = tempVers.indexOf( 'MSIE ' );
if( i >= 0 ) {
tempVers = tempVers.substring( i+5 );
ieVers = parseFloat( tempVers );
}
return ieVers;
}
function mouseoutMenu() {
if ((navigator.appName == "Microsoft Internet Explorer") && (getExplorerVersion() < 4.5))
return true;
hideMenu(false, false);
return true;
}
function hideMenu(mouseup, e) {
var a = window.ActiveMenuItem;
if (a && document.layers) {
a.document.bgColor = a.saveColor;
a.focusItem.top = -30;
if (a.hilite) a.hilite.visibility = "hidden";
if (mouseup && a.mmaction && a.clicked && window.ActiveMenu) {
if (a.eX <= e.pageX+15 && a.eX >= e.pageX-15 && a.eY <= e.pageY+10 && a.eY >= e.pageY-10) {
setTimeout('window.ActiveM
}
}
a.clicked = false;
if (a.Menu.bgImageOver) a.background.src = a.Menu.bgImageUp;
} else if (window.ActiveMenu && FIND("menuItem0")) {
if (a) {
a.style.backgroundColor = a.saveColor;
if (a.hilite) a.hilite.style.visibility = "hidden";
if (a.hiliteShim) a.hiliteShim.style.visibil
if (a.Menu.bgImageUp) a.style.background = "url(" + a.Menu.bgImageUp +")";
}
}
if (!mouseup && window.ActiveMenu) {
if (window.ActiveMenu.Menu) {
if (window.ActiveMenu.Menu.hi
return(true);
}
}
return(true);
}
function hideChildMenu(hcmLayer) {
MM_clearTimeout();
var l = hcmLayer;
for (var i=0; i < l.Menu.childMenus.length; i++) {
var theLayer = l.Menu.childMenus[i];
if (document.layers) theLayer.visibility = "hidden";
else {
theLayer = FIND(theLayer);
theLayer.style.visibility = "hidden";
if( theLayer.Menu.menuItemHAli
for(var j = 0; j < theLayer.Menu.menuItemLaye
var itemLayer = theLayer.Menu.menuItemLaye
if(itemLayer.textShim) itemLayer.textShim.style.v
}
}
}
theLayer.Menu.hideChildMen
}
if (l.childMenu) {
var childMenu = l.childMenu;
if (document.layers) {
l.Menu.MM_showMenu(null,nu
childMenu.zIndex = l.parentLayer.zIndex +1;
childMenu.top = l.Menu.menuLayer.top + l.Menu.submenuYOffset;
if( l.Menu.vertical ) {
if( l.Menu.submenuRelativeToIt
childMenu.left = l.parentLayer.left + l.parentLayer.clip.width - (2*l.Menu.menuBorder) + l.Menu.menuLayer.left + l.Menu.submenuXOffset;
} else {
childMenu.top += l.top + l.parentLayer.top;
if( l.Menu.submenuRelativeToIt
else childMenu.left = l.parentLayer.left + l.parentLayer.clip.width - (2*l.Menu.menuBorder) + l.Menu.menuLayer.left + l.Menu.submenuXOffset;
}
if( childMenu.left < l.Menu.container.clip.left
var w = childMenu.clip.width+child
if (w > l.Menu.container.clip.widt
var h = childMenu.clip.height+chil
if (h > l.Menu.container.clip.heig
l.document.layers[1].zInde
childMenu.visibility = "inherit";
} else if (FIND("menuItem0")) {
childMenu = FIND(l.childMenu);
var menuLayer = FIND(l.Menu.menuLayer);
var s = childMenu.style;
s.zIndex = menuLayer.style.zIndex+1;
if (document.all || window.mmIsOpera) {
s.pixelTop = menuLayer.style.pixelTop + l.Menu.submenuYOffset;
if( l.Menu.vertical ) {
if( l.Menu.submenuRelativeToIt
s.pixelLeft = l.style.pixelWidth + menuLayer.style.pixelLeft + l.Menu.submenuXOffset;
s.left = s.pixelLeft + 'px';
} else {
s.pixelTop += l.style.pixelTop;
if( l.Menu.submenuRelativeToIt
else s.pixelLeft = (menuLayer.style.pixelWidt
s.left = s.pixelLeft + 'px';
}
} else {
var top = parseInt(menuLayer.style.t
var left = 0;
if( l.Menu.vertical ) {
if( l.Menu.submenuRelativeToIt
left = (parseInt(menuLayer.style.
} else {
top += parseInt(l.style.top);
if( l.Menu.submenuRelativeToIt
else left = (parseInt(menuLayer.style.
}
s.top = top + 'px';
s.left = left + 'px';
}
childMenu.style.visibility
} else return;
window.activeMenus[window.
}
}
function hideActiveMenus() {
if (!window.activeMenus) return;
for (var i=0; i < window.activeMenus.length;
if (!activeMenus[i]) continue;
if (activeMenus[i].visibility
activeMenus[i].visibility = "hidden";
activeMenus[i].Menu.contai
activeMenus[i].Menu.contai
} else if (activeMenus[i].style) {
var s = activeMenus[i].style;
s.visibility = "hidden";
s.left = '-200px';
s.top = '-200px';
}
}
if (window.ActiveMenuItem) hideMenu(false, false);
window.activeMenus.length = 0;
}
function moveXbySlicePos (x, img) {
if (!document.layers) {
var onWindows = navigator.platform ? navigator.platform == "Win32" : false;
var macIE45 = document.all && !onWindows && getExplorerVersion() == 4.5;
var par = img;
var lastOffset = 0;
while(par){
if( par.leftMargin && ! onWindows ) x += parseInt(par.leftMargin);
if( (par.offsetLeft != lastOffset) && par.offsetLeft ) x += parseInt(par.offsetLeft);
if( par.offsetLeft != 0 ) lastOffset = par.offsetLeft;
par = macIE45 ? par.parentElement : par.offsetParent;
}
} else if (img.x) x += img.x;
return x;
}
function moveYbySlicePos (y, img) {
if(!document.layers) {
var onWindows = navigator.platform ? navigator.platform == "Win32" : false;
var macIE45 = document.all && !onWindows && getExplorerVersion() == 4.5;
var par = img;
var lastOffset = 0;
while(par){
if( par.topMargin && !onWindows ) y += parseInt(par.topMargin);
if( (par.offsetTop != lastOffset) && par.offsetTop ) y += parseInt(par.offsetTop);
if( par.offsetTop != 0 ) lastOffset = par.offsetTop;
par = macIE45 ? par.parentElement : par.offsetParent;
}
} else if (img.y >= 0) y += img.y;
return y;
}
please send the link on your server.
thanks.
thanks.
ASKER
Sure thing -- an operating version of the script can be found at:
www.thebetterway.com.au/dropdowntest
www.thebetterway.com.au/dropdowntest
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Yes indeedy, that did the trick.
From following your lead I've also now figured out how to add an image rollover. Thanks for pointing the way...
From following your lead I've also now figured out how to add an image rollover. Thanks for pointing the way...