Такая проблема возникает во всех браузерах.
<style><!--
.layer { VISIBILITY: hidden; POSITION:absolute; margin-top:1px;}
.layer A{ text-align:left; color:#FFFFFF}
.layer A:hover{}
TABLE.tmenu { border-collapse:collapse; border:0px; }
TABLE.tmenu TH{ white-space:nowrap; padding:0px; text-align:left; color:#f06426; font-weight:normal; font:11px Verdana; }
TABLE.tmenu TD{ padding:0px; vertical-align:top; font:11px Verdana; color:#f06426; padding-left:3px; padding-right:3px;}
TABLE.tmenu A{text-transform:none; color:#000000; display:block; padding-bottom:3px; padding-top:3px; text-decoration:none; font-weight:bold; }
TABLE.tmenu A:hover{ color:#FF0000; text-decoration:none }
TABLE.tmenu A.select{ color:#FF0000; }
TABLE.submenu1{ border-collapse:collapse; border:0px; }
TABLE.submenu1 TD{ white-space:nowrap; padding:5px; background-color:#ffffcc; }
TABLE.submenu1 TH{ white-space:nowrap; padding:0px; width:10px; height:10px;}
TABLE.submenu1 A{text-transform:none; color:#000000; display:block; padding-bottom:3px; padding-top:3px; text-decoration:none; }
TABLE.submenu1 A:hover{ color:#FF0000; text-decoration:none }
TABLE.submenu1 A.select{ color:#FF0000; }
</style>
var isOpera = (navigator.userAgent.indexOf("Opera") != -1) ? true : false;
var DOM = (typeof(document.getElementById) != 'undefined');
var openLayers = new Array();
var noClose = 0;
var currentLayerNum=0;
var closeTimer = null;
var closeSubMenu = null;
var bTranState = 0;
function mopen(n, level)
{
var vl = document.getElementById("menu_"+n);
if(bTranState)
{
// vl.style.visibility='hidden';
// currentLayerNum = 0;
bTranState = 0;
}
else
{
bTranState = 0;
if(closeSubMenu){ window.clearTimeout(closeSubMenu); closeSubMenu = null; }
mcancelclosetime();
if(openLayers[level] && (openLayers[level] != n)) document.getElementById("menu_"+openLayers[level]).style.visibility='hidden';
openLayers[level] = n;
currentLayerNum = n;
vl.style.visibility='visible';
}
}
/* Закрываем открытые подуровни, при перемещении курсора по пунктам меню */
function mchitem(level, n)
{
mcancelclosetime();
currentLayerNum = n;
closeSubMenu = window.setTimeout("mclose("+level+")", 300);
}
function mclosetime()
{
// document.form.events.value+=" "+currentLayerNum;
closeTimer = window.setTimeout(mallclose, 1000);
}
function mcancelclosetime()
{
// document.form.events.value+=" cancel="+currentLayerNum;
if(closeTimer) { window.clearTimeout(closeTimer); closeTimer = null; }
}
function mclose(level)
{
if (openLayers[level])
{
for (i=level; i<openLayers.length; i++)
{
if (currentLayerNum!=openLayers[i]) { document.getElementById("menu_"+openLayers[i]).style.visibility='hidden'; openLayers[i]=''; }
}
}
}
/* Закрываем все открытые подменю */
function mallclose()
{
if (openLayers.length>0)
{
for( var key in openLayers ) { document.getElementById("menu_"+openLayers[key]).style.visibility='hidden'; openLayers[key]=''; }
}
}
document.onclick = mallclose;
На выводе так
Меню 1
<TABLE class="tmenu"><tr> <td> <strong>1</strong></td>
<td>|</td><th >
<a href="javascript:mopen(2, 1); void(0);" >Работа </a>
Подменю
<DIV class="layer" style=" z-index:3" id="menu_2"><table class="submenu2"><tr><td >
<a href="javascript:void(0);" onmouseover="javascript:mopen(34, 2); return false;" class="smenu" >Работодатели </a>
</td></tr>
<tr><td >
<a href="/notice-board/1/2/35/" onmouseover="mchitem(2, 35);" >Персонал </a>
</td></tr>
<tr><td >
<a href="/notice-board/1/2/36/" onmouseover="mchitem(2, 36);" >Содействие в трудоустройстве </a>
</td></tr>
<table>
Меню 2
<TABLE class="tmenu"><tr> <td> <strong>2</strong></td>
<td>|</td><th >
<a href="/notice-board/7/8/" onmouseover="mclosetime()" >Бытовая техника </a>
</th>
<td>|</td><th >
<a href="/notice-board/7/8/" onmouseover="mclosetime()" >Бытовая техника </a>
</th>
<td>|</td><th >
<a href="/notice-board/7/8/" onmouseover="mclosetime()" >Бытовая техника </a>
</th>
</tr>
</table>
