Estoy haciendo un menú desplegable y quiero que el menú inferior no se oculte hasta pasado "x" tiempo desde que se saca el cursor del menu superior.
Lo tengo hecho así:
Javascript: Código HTML:
<script type="text/javascript">
function oculta (kpa) {
var capa = document.getElementById(kpa);
setTimeout('capa.style.visibility="hidden"',2000);
}
function muestra (kpa) {
document.getElementById(kpa).style.visibility="visible";
}
</script>
Diseño de menu's Código HTML:
<div id="menu1">
<table width="800" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCC99">
<tr>
<td align="center">INICIO</td>
<td align="center" onmouseover="muestra('menu2')" onmouseout="oculta('menu2')">CATEGORIAS</td>
<td align="center">MIS THEMES </td>
<td align="center">ENVIAR THEME </td>
<td align="center">BUSQUEDA</td>
<td align="center">FORO</td>
<td height="30" align="center">CONTACTO</td>
</tr>
</table>
</div>
<div id="menu2" style="visibility:hidden">
<table width="800" border="0" cellpadding="0" cellspacing="0" bgcolor="#CC9966">
<tr>
<td align="center">SUB 1 </td>
<td align="center">SUB2</td>
</tr>
</table>
</div>
El funcionamiento seria que al situarte en categorias mostrara el submenú (cosa que hace bien) y que al salir de él, el submenú tardara un tiempo en ocultarse. En lugar de eso, pasa el tiempo y el IE da el mensajito de error en la esquina inferior izquierda.
Si alguien ve donde puedo estar comentiendo el error será de agradecer
Gracias.