dgelinas
asked on
Menu Item on Dynamic Menu will not highlight on mouseover
I took out alot of the extra code but some still exists.. This is problem a simple problem but I can't get it to work. It used to highlight on mouseover until I had to change this line
document.write('<a style="width: 190px" class="menuItem" href="javascript:menuActio n(\''+theM enu.action s[i]+ '\',\''+theMenu.typeOfOpen [i]+'\')"> ' + theMenu.items[i] + '</a>');
TO this line
document.write('<a style="width: 190px" class="menuItem" OnMouseOver="menuItemMouse Over(\'' + theMenu.items[i] + '\')" onClick="menuAction(\''+th eMenu.acti ons[i]+ '\',\''+theMenu.typeOfOpen [i]+'\')"> ' + theMenu.items[i] + '</a>');
With the above line the row whould highlight from this line of css code which doesn't work anymore
a.menuItem:hover { background-color: #FFCE85; color:black;cursor: default; z-index:1000;}
Thanks!!!!!!!!!!!!!!
var timeOut = null, numMenus = 0;
var menus = new Object();
var ns4 = false; // true if the browser supports layers
var ie4 = false; // true if the browser supports document.all
var otherDOM = false; // true if ns6
var ie5plus = false; // true if browser is IE 5+
var adjustSpacing = false; // true if we need to adjust menu spacing
var activeMenuHeading = -1; // holds number of the active menu (heading)
function detectBrowser()
{
if (document.layers)
ns4 = true;
else if (document.all)
{
ie4 = true;
if (navigator.userAgent.index Of("MSIE 4") != -1)
ie5plus = false;
else
ie5plus = true;
if (((navigator.userAgent.ind exOf("MSIE 5.5") == -1) &&
(navigator.userAgent.index Of("MSIE 6") == -1)) ||
(navigator.userAgent.index Of("Mac") != -1))
adjustSpacing = true;
}
else if (document.getElementById)
{
otherDOM = true;
adjustSpacing = true;
}
}
function showMenu(which,x,y)
{
// accepts an integer indicating which menu to show and x/y
document.getElementById("m enu" + which).style.left = x;
document.getElementById("m enu" + which).style.top = y;
document.getElementById("m enu" + which).style.visibility = "visible";
}
function hideMenu(which)
{
// accepts an integer indicating which menu to hide
document.getElementById("m enu" + which).style.visibility = "hidden";
}
// Note: Valid values for openNewWindow are "newWindow" or "overlay".
// overlay - over writes the information in the current window.
// newWindow - opens a new window
//
function addItem(menuName, item, action, openNewWindow)
{
if (!menus[menuName])
{
var newMenu = new Object();
newMenu.name = menuName;
newMenu.num = numMenus++;
newMenu.items = new Array();
newMenu.actions = new Array();
newMenu.typeOfOpen = new Array(); //true = open new window, false=overlay/replace current window
menus[menuName] = newMenu;
}
// IE4 doesn't support push() so add manually
menus[menuName].items[menu s[menuName ].items.le ngth] = item;
menus[menuName].actions[me nus[menuNa me].action s.length] = action;
menus[menuName].typeOfOpen [menus[men uName].typ eOfOpen.le ngth] = openNewWindow;
}
function createMenuHeadings() {
else if (ie4 || otherDOM)
{
document.write('<div class="menuBar">');
debugWrite('<div class="menuBar">');
}
for (var menu in menus)
{
var theMenu = menus[menu];
(ie4 || otherDOM)
{
document.write('<a onclick="menuHeadingMouseC lick(event , ' + theMenu.num + '); return false" onmouseout="menuHeadingMou seOut(' + theMenu.num + ')" onmouseover=" menuHeadingMouseClick(even t, ' + theMenu.num + ')" class="menuHeading" id="menuHeading' + theMenu.num + '">' + theMenu.name + '</a>');
debugWrite('<a onclick="menuHeadingMouseC lick(event , ' + theMenu.num + '); return false" onmouseout="menuHeadingMou seOut(' + theMenu.num + ')" onmouseover="menuHeadingMo useOver(' + theMenu.num + ')" class="menuHeading" id="menuHeading' + theMenu.num + '">' + theMenu.name + '</a>');
}
if (adjustSpacing)
{
document.write(' ');
debugWrite(' ');
}
}
if (ie4 || otherDOM)
{
document.write('</div>');
debugWrite('</div>');
}
}
function createMenus()
{
createMenuHeadings();
for (var menu in menus)
{
var theMenu = menus[menu];
if (ie4 || otherDOM)
{
document.write('<div class="menu" id="menu' + theMenu.num + '" onmouseover="clearTimeout( timeOut)" onmouseout="timeOut = setTimeout(\'menuHeadingDe activate() ; hideMenu(' + theMenu.num + ')\',100)">');
}
for (var i=0; i<theMenu.items.length; i++)
{
if (ie4 || otherDOM)
{
//document.write('<a style="width: 190px" class="menuItem" href="' + theMenu.actions[i] + '">' + theMenu.items[i] + '</a>');
//document.write('<a style="width: 190px" class="menuItem" onClick="menuAction(\''+th eMenu.acti ons[i] + '\')">' + theMenu.items[i] + '</a>');
document.write('<a style="width: 190px" class="menuItem" OnMouseOver="menuItemMouse Over(\'' + theMenu.items[i] + '\')" onClick="menuAction(\''+th eMenu.acti ons[i]+ '\',\''+theMenu.typeOfOpen [i]+'\')"> ' + theMenu.items[i] + '</a>');
}
if (ie4 && !ie5plus)
{
document.write('<br>');
}
}
}
function menuItemMouseOver(menuItem ) //Need to do something here to hightlike the row
{
document.all("menuItem" + menuItem).style.borderColo r="#BBCCCC black black #BBCCCC";
}
function menuHeadingMouseOver(menuH eading)
{
if (ie4)
document.all("menuHeading" + menuHeading).style.borderC olor="#BBC CCC black black #BBCCCC";
else if (otherDOM)
document.getElementById("m enuHeading " + menuHeading).style.borderC olor="#BBC CCC black black #BBCCCC";
}
function menuHeadingMouseOut(menuHe ading)
{
if (ie4 || otherDOM)
{
if (activeMenuHeading != -1 && activeMenuHeading == menuHeading)
timeOut = setTimeout('hideMenu(' + activeMenuHeading + '); menuHeadingDeactivate();', 100);
else
{
if (ie4)
document.all("menuHeading" + menuHeading).style.borderC olor="#BBC CCC";
else
document.getElementById("m enuHeading " + menuHeading).style.borderC olor="#BBC CCC";
}
}
}
function menuHeadingActivate(menuHe ading)
{
document.getElementById("m enuHeading " + menuHeading).style.backgro und = "#EEEEEE";
document.getElementById("m enuHeading " + menuHeading).style.color = "#6688BB";
document.getElementById("m enuHeading " + menuHeading).style.borderC olor = "#BBCCCC black #EEEEEE #EEEEEE";
activeMenuHeading = menuHeading;
}
function menuHeadingDeactivate()
{
if (activeMenuHeading != -1)
{
document.getElementById("m enuHeading " + activeMenuHeading).style.b orderColor = "#BBCCCC";
document.getElementById("m enuHeading " + activeMenuHeading).style.b ackground = "transparent";
document.getElementById("m enuHeading " + activeMenuHeading).style.c olor = "#6688BB";
activeMenuHeading = -1;
}
}
function menuHeadingMouseClick(even t, which) {
if (activeMenuHeading != -1)
{
clearTimeout(timeOut);
hideMenu(activeMenuHeading );
menuHeadingDeactivate();
}
if (ie4 || otherDOM)
menuHeadingActivate(which) ;
if (event.srcElement)
{
x = event.srcElement.offsetLef t;
y = event.srcElement.offsetTop + event.srcElement.offsetHei ght;
}
else if (otherDOM)
{
// NS6 specific
x = document.getElementById("m enuHeading " + which).offsetLeft;
y = document.getElementById("m enuHeading " + which).offsetTop + document.getElementById("m enuHeading " + which).offsetHeight;
}
if (adjustSpacing)
{
x += 5; y += 7;
}
showMenu(which, x, y);
}
function menuAction(myAction, openType)
{
if(openType.toLowerCase() == "overlay") //use the same window
{
location.replace(myAction) ;
} else if ( openType.toLowerCase() == "newwindow" ) {
window.open(myAction,"","s crollbars= no");
} else if ( openType.toLowerCase() == "dooption" ) {
parent.window.focus();
doOption( myAction );
} else if ( openType.toLowerCase() == "nafeature") {
parent.window.focus();
naFeature();
} else {
alert ( "menu action undefined" );
}
}
document.write('<a style="width: 190px" class="menuItem" href="javascript:menuActio
TO this line
document.write('<a style="width: 190px" class="menuItem" OnMouseOver="menuItemMouse
With the above line the row whould highlight from this line of css code which doesn't work anymore
a.menuItem:hover { background-color: #FFCE85; color:black;cursor: default; z-index:1000;}
Thanks!!!!!!!!!!!!!!
var timeOut = null, numMenus = 0;
var menus = new Object();
var ns4 = false; // true if the browser supports layers
var ie4 = false; // true if the browser supports document.all
var otherDOM = false; // true if ns6
var ie5plus = false; // true if browser is IE 5+
var adjustSpacing = false; // true if we need to adjust menu spacing
var activeMenuHeading = -1; // holds number of the active menu (heading)
function detectBrowser()
{
if (document.layers)
ns4 = true;
else if (document.all)
{
ie4 = true;
if (navigator.userAgent.index
ie5plus = false;
else
ie5plus = true;
if (((navigator.userAgent.ind
(navigator.userAgent.index
(navigator.userAgent.index
adjustSpacing = true;
}
else if (document.getElementById)
{
otherDOM = true;
adjustSpacing = true;
}
}
function showMenu(which,x,y)
{
// accepts an integer indicating which menu to show and x/y
document.getElementById("m
document.getElementById("m
document.getElementById("m
}
function hideMenu(which)
{
// accepts an integer indicating which menu to hide
document.getElementById("m
}
// Note: Valid values for openNewWindow are "newWindow" or "overlay".
// overlay - over writes the information in the current window.
// newWindow - opens a new window
//
function addItem(menuName, item, action, openNewWindow)
{
if (!menus[menuName])
{
var newMenu = new Object();
newMenu.name = menuName;
newMenu.num = numMenus++;
newMenu.items = new Array();
newMenu.actions = new Array();
newMenu.typeOfOpen = new Array(); //true = open new window, false=overlay/replace current window
menus[menuName] = newMenu;
}
// IE4 doesn't support push() so add manually
menus[menuName].items[menu
menus[menuName].actions[me
menus[menuName].typeOfOpen
}
function createMenuHeadings() {
else if (ie4 || otherDOM)
{
document.write('<div class="menuBar">');
debugWrite('<div class="menuBar">');
}
for (var menu in menus)
{
var theMenu = menus[menu];
(ie4 || otherDOM)
{
document.write('<a onclick="menuHeadingMouseC
debugWrite('<a onclick="menuHeadingMouseC
}
if (adjustSpacing)
{
document.write(' ');
debugWrite(' ');
}
}
if (ie4 || otherDOM)
{
document.write('</div>');
debugWrite('</div>');
}
}
function createMenus()
{
createMenuHeadings();
for (var menu in menus)
{
var theMenu = menus[menu];
if (ie4 || otherDOM)
{
document.write('<div class="menu" id="menu' + theMenu.num + '" onmouseover="clearTimeout(
}
for (var i=0; i<theMenu.items.length; i++)
{
if (ie4 || otherDOM)
{
//document.write('<a style="width: 190px" class="menuItem" href="' + theMenu.actions[i] + '">' + theMenu.items[i] + '</a>');
//document.write('<a style="width: 190px" class="menuItem" onClick="menuAction(\''+th
document.write('<a style="width: 190px" class="menuItem" OnMouseOver="menuItemMouse
}
if (ie4 && !ie5plus)
{
document.write('<br>');
}
}
}
function menuItemMouseOver(menuItem
{
document.all("menuItem" + menuItem).style.borderColo
}
function menuHeadingMouseOver(menuH
{
if (ie4)
document.all("menuHeading"
else if (otherDOM)
document.getElementById("m
}
function menuHeadingMouseOut(menuHe
{
if (ie4 || otherDOM)
{
if (activeMenuHeading != -1 && activeMenuHeading == menuHeading)
timeOut = setTimeout('hideMenu(' + activeMenuHeading + '); menuHeadingDeactivate();',
else
{
if (ie4)
document.all("menuHeading"
else
document.getElementById("m
}
}
}
function menuHeadingActivate(menuHe
{
document.getElementById("m
document.getElementById("m
document.getElementById("m
activeMenuHeading = menuHeading;
}
function menuHeadingDeactivate()
{
if (activeMenuHeading != -1)
{
document.getElementById("m
document.getElementById("m
document.getElementById("m
activeMenuHeading = -1;
}
}
function menuHeadingMouseClick(even
if (activeMenuHeading != -1)
{
clearTimeout(timeOut);
hideMenu(activeMenuHeading
menuHeadingDeactivate();
}
if (ie4 || otherDOM)
menuHeadingActivate(which)
if (event.srcElement)
{
x = event.srcElement.offsetLef
y = event.srcElement.offsetTop
}
else if (otherDOM)
{
// NS6 specific
x = document.getElementById("m
y = document.getElementById("m
}
if (adjustSpacing)
{
x += 5; y += 7;
}
showMenu(which, x, y);
}
function menuAction(myAction, openType)
{
if(openType.toLowerCase() == "overlay") //use the same window
{
location.replace(myAction)
} else if ( openType.toLowerCase() == "newwindow" ) {
window.open(myAction,"","s
} else if ( openType.toLowerCase() == "dooption" ) {
parent.window.focus();
doOption( myAction );
} else if ( openType.toLowerCase() == "nafeature") {
parent.window.focus();
naFeature();
} else {
alert ( "menu action undefined" );
}
}
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.