Tema: Evento OnMouseOut sobre <a>
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 10/08/2009, 08:06
yonolose
(Desactivado)
  
Fecha de Ingreso: marzo-2008
Mensajes: 641
Antigüedad: 16 años, 10 meses
Puntos: 7
Evento OnMouseOut sobre <a>
Hola

Estoy haciendo un menú desplegable, pero pasa algo bastante extraño que no sé cómo solucionar.

El menú se muestra y oculta como yo quiero cuando solo tiene texto, pero si le pongo alguna etiqueta <a>... y se pone el cursor sobre el link, el menú se oculta, como si hubiese sacado el cursor del div...

Ver el menú en funcionamiento

Este es el código:

Código javascript: 
Ver original
  1. <head>
  2. <script language="javascript">
  3.  
  4. function ocultar(){
  5.  
  6.  document.getElementById('menuoculto').style.visibility = "hidden";
  7.  
  8. }
  9.  
  10.  
  11. function mostrar(what){
  12.  
  13. switch(what){
  14.  
  15. case "menua":
  16.  
  17. var mostrarHTML="<a href='#'>Men&uacute; oculto A, con una etiqueta a</a>";
  18.  
  19. break;
  20.  
  21. case "menub":
  22.  
  23. var mostrarHTML="Parte B sin etiquetas, solo texto";
  24.  
  25. break;
  26.  
  27. }
  28.  
  29.  document.getElementById('menuoculto').innerHTML = mostrarHTML;
  30.   
  31.  document.getElementById('menuoculto').style.visibility = "visible";
  32.  
  33. }
  34.  
  35. </script>
  36.  
  37.  
  38. </head>
  39.  
  40. <body>
  41.  
  42.  
  43.              <div style="overflow:auto;">
  44.  
  45. <div style="width:150px;float:left;" onMouseOver="mostrar('menua')">Men&uacute; A</div>
  46.  
  47. <div style="width:150px;float:left;" onMouseOver="mostrar('menub')">Men&uacute; B</div>
  48.  
  49.  
  50. <div onMouseOut="ocultar()" id="menuoculto" style="margin-top:20px;border:1px solid;padding:5px;visibility:hidden;"></div>
  51.  
  52.  
  53.              </div>

Un saludo y espero se pueda solucionar...