¡Hola a todos!
Estoy intentando hacer que un pequeño menú aparezca al pasar sobre un link y que desaparezca al pulsar sobre un opción o al salir del propio menú. He conseguido que el menú aparezca, pero le digo que desaparezca al salir de él con onmouseout del div que contiene el menú y se oculta en cuanto salgo de la primera línea del menú. He visto en el foro que hay otra persona con el mismo problema que yo, pero nadie le ha respondido (
http://www.forosdelweb.com/showthrea...mouseout+layer)
Aquí tenéis el código lo más reducico que he podido:
Código PHP:
<html>
<head>
<style type="text/css">
.capa {
background-color: #FDDBD7;
border-style: solid;
border-width: 1px;
position: absolute;
visibility: hidden;
}
</style>
<script language="JavaScript" type="text/javascript">
<!--
function muestra(idCapa, evento) {
var capa;
// Recuperamos el objeto capa dependiendo del navegador
if (document.layers) capa = eval("document." + idCapa);
if (document.all) capa = eval(idCapa);
if (document.getElementById) capa = eval('document.getElementById("' + idCapa + '")');
// Calculamos las coordenadas en las que va a aparecer y se las asignamos
var x = (document.all)? evento.x + document.body.scrollLeft : evento.pageX;
var y = (document.all)? evento.y + document.body.scrollTop : evento.pageY;
capa.style.left = x - 5;
capa.style.top = y - 5;
// Creamos el contenido del menu
var cont = "<table class='menu'><tr class='cabecera'><td>ACCION</td></tr>";
cont += "<tr><td><a href='http://www.google.com'>google</a></td></tr>";
cont += "<tr><td><a href='http://www.yahoo.com'>yahoo</a></td></tr>";
cont += "</table>";
capa.innerHTML = cont;
// Mostramos la capa
capa.style.visibility = (document.layers) ? "show" : "visible";
}
function oculta(capa) {
capa.style.visibility = (document.layers) ? "hide" : "hidden";
}
// -->
</script>
</head>
<body>
<div id="contenedor" class="capa" onmouseout="oculta(this)"></div>
<a href="#" onmouseover="muestra('contenedor', event)">menu</a>
</body>
</html>
Muchas gracias
