Foros del Web » Creando para Internet » CSS »

Menú Vertical Desplegable con problemas.

Estas en el tema de Menú Vertical Desplegable con problemas. en el foro de CSS en Foros del Web. Hola a todos. Hace un tiempo hice un menú desplegable vertical en html, (<ul> y <li>), y con CSS. Y recientemente me han informado que ...
  #1 (permalink)  
Antiguo 26/11/2008, 06:32
 
Fecha de Ingreso: noviembre-2008
Mensajes: 16
Antigüedad: 9 años
Puntos: 0
Menú Vertical Desplegable con problemas.

Hola a todos.

Hace un tiempo hice un menú desplegable vertical en html, (<ul> y <li>), y con CSS.

Y recientemente me han informado que el menú llegado ha cierta parte se salta y no pueden llegar a otros menús.

El código del menú es el siguiente:


Código:
<center>
<ul class="menu">
<li>Menú Del FORO
	<ul>
   		<li>XXXX
   			<ul>
     			    <li><a href="">XXXX</a></li>
      			</ul>
   		</li>
   		<li>XXXX
      <ul>
         <li><a href="">XXXX</a></li>
         <li><a href="">XXXX</a></li>
         <li><a href="">XXXX</a></li>
      </ul>
   </li>
   <li>XXXX
      <ul>
         <li><a href="">XXXX</a></li>
      </ul>
   </li>
   <li>XXXX
      <ul>
         <li><a href="">XXXX</a></li>
         <li><a href="">XXXX</a></li>
         <li><a href="">XXXX</a></li>
         <li><a href="">XXXX</a></li>
         <li><a href="">XXXX</a></li>
         <li><a href="">XXXX</a></li>
      </ul>
   </li>
   <li>XXXX
      <ul>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
      </ul>
   </li>
   <li>SXXXX
      <ul>
               <li><a href="">SXXXX</a></li>
               <li><a href="">XXXX</a></li>
      </ul>
   </li>
   <li>XXXX
      <ul>
       		<li><a href="">XXXX</a></li>
	        <li><a href="">XXXX</a></li>
                <li><a href="">XXXX</a></li>
                <li><a href="">XXXX</a></li>
                <li><a href="">XXXX</a></li>
                <li><a href="">RXXXXs</a></li>
      </ul>
   </li>
   <li>XXXX
      <ul>
         <li><a href="">XXXX</a></li>
         <li><a href="#">XXXX</A>
            <ul>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXXS</a></li>
           </ul>
        </li>
         <li><a href="#">XXXX</a>
            <ul>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
            </ul>
         </li>
      </ul>
   </li>
   <li>XXXX
      <ul>
         <li>XXXX
            <ul>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXXuda</a></li>
               <li><a href="">AXXXXón</a></li>
            </ul>
         </li>
          <li>BXXXX
            <ul>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
               <li><a href="">XXXX</a></li>
            </ul>
         </li>
      </ul>
   </li>
  <li>XXXX
      <ul>
       		<li><a href="">XXXX</a></li>
	        <li><a href="">XXXX</a></li>
                <li><a href="">PXXXXXXXX</a></li>
                <li><a href="">XXXX</a></li>
                <li><a href="">XXXX</a></li>
                <li><a href="">XXXX</a></li>
                <li> </li>
      </ul>
   </li>
   <li><a href="">XXXX<a></li>
   <li><a href="">XXXX<a></li>
   <li>XXXX
      <ul>
         <li>XXXX
            <ul>
               <li><a href="">XXXX     	</a></li>
               <li><a href="">XXXX		</a></li>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX	</a></li>
            </ul>
          </li>
          <li>XXXX
            <ul>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX		</a></li>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX	</a></li>
               <li><a href="">XXXX	</a></li>
            </ul>
         </li>
      </ul>
   </li>
   </ul>
   </li>
</ul></center>

El código de la hoja de estilos es el siguiente:


Código:
ul.menu
{
    background-image: url('http ... fondomenu.png');
    background-position: center top;
    line-height: 22px;
    background-repeat: repeat-y;
    list-style:none;
}

ul.menu ul 
{
   overflow-y: hide;
   border-style: solid;    
   border-width: 0px;
   display:none;
   list-style:none;
} 

ul.menu li:hover > ul
{
   display:block;
}

Estuve viendo si existía alguna restricción para el número de <ul> o <li> Anidados, no los encontré. Luego probé con partir el menú en dos, el resultado era el mismo.

Existe alguna manera de dejar alguna especie de pausa, o que el hover, demore un par de segundos antes de cerrar el menú?.

De Antemano muchas gracias.

Última edición por Rapaig; 24/05/2009 a las 11:09
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:35.