Hola foristas:
Quizás es sencillo lo que voy a pedir. En el menú que muestro más abajo a modo de ejemplo, al pasar el mouse por la "Fila 2" se muestra un submenu, y si el mouse lo muevo hacia el submenu, me desaparece el color gris de background de la Fila 2.
Como puedo hacer para que quede marcada la línea "Fila 2" mientras yo tenga el mouse en su submenú ??
Pregunto porque lo veo en muchas páginas y no sé como hacen. Yo he visto menús desarrollados por Mikmoro, pero prefiero hacerlo sin usar las condiciones para el IE, prefiero hacerlo todo con <UL> y <LI>.
Saludos y desde ya muchas gracias.
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body {margin:0;font:11px Tahoma,Arial,Helvetica,sans-serif;}
ul {width:125px;margin:0;padding:0;background:#FF0000;}
ul li {border-bottom:1px solid #FFFFFF;position:relative;list-style:none;}
ul li a {color:#363636;display:block;position:relative;line-height:18px;}
ul li a:hover {color:#990000;background:#DAD3D3;}
ul li ul {width:125px;background:#ECE9E9;display:none;position:absolute;left:125px;top:0;}
</style>
<script language="JavaScript">
function submenu(llamador)
{
var valor = llamador.parentNode.getElementsByTagName('ul')[0];
valor.style.display = valor.style.display == 'block' ? 'none' : 'block' ;
}
</script>
</head>
<body>
<ul>
<li><a href="#">Fila 1</a></li>
<li onMouseOver="submenu(this)" onMouseOut="submenu(this)"><a href="#">Fila 2</a>
<ul>
<li><a href="#">Sub fila 1</a></li>
<li><a href="#">Sub fila 2</a></li>
<li><a href="#">Sub fila 3</a></li>
<li><a href="#">Sub fila 4</a></li>
<li><a href="#">Sub fila 5</a></li>
</ul>
</li>
<li><a href="#">Fila 3</a></li>
<li><a href="#">Fila 4</a></li>
</ul>
</body>
</html>