Foros del Web » Creando para Internet » HTML »

Menu horizontal con dropdown horizontal css+js

Estas en el tema de Menu horizontal con dropdown horizontal css+js en el foro de HTML en Foros del Web. Hola, y gracias por leer el tema. LEs cuento que he tratado de implementar un menu similar al de desarrolloweb.com (menu superior de aletas), he ...
  #1 (permalink)  
Antiguo 24/05/2006, 10:56
 
Fecha de Ingreso: mayo-2006
Mensajes: 2
Antigüedad: 11 años, 6 meses
Puntos: 0
Menu horizontal con dropdown horizontal css+js

Hola, y gracias por leer el tema.


LEs cuento que he tratado de implementar un menu similar al de desarrolloweb.com (menu superior de aletas), he copiado el codigo y algunas opciones de ejemplo pero no logro el resultado.

aqui hay un ejemplo de lo que yo he hecho:

soluciones-informaticas.cl/tests/menu.php

Mi problema es que cuando al pasar por cada opcion de menu1,menu2 etc los submenus no aparecen en la misma posicion si no que aparecen en la misma posicion en la cual se encuentran dentro del HTML.


Cualquier sugerencia es bienvenida.

Gracias.
  #2 (permalink)  
Antiguo 24/05/2006, 17:00
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
El problema es que estás usando propiedad "visibility" de css cuando lo que corresponde es usar "display".
Visibility solamente hace invisible al elemento, pero el espacio que ocupa sigue ahí, mientras que display directamente no genera la caja correspondiente.

Entonces lo que para mí tenés que hacer es cambiar las clases "ancla" y "cenlaces", sustituyendo "visibility : visible" por "display : block" y "visibility : hidden" por "display : none"


Saludos.
  #3 (permalink)  
Antiguo 25/05/2006, 21:01
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
mirá, analizando tu código me di cuenta de que lo que te comenté no te sirve, ya que se está usando "visibility" EN LA BIBLIOTECA CSS que estás importando.

Así que la respuesta anterior es inútil. La solución va por otro lado...


Revisando el código de la hoja de estilos de desarrolloweb, creo que llegué al punto importante:

los elementos de clase "cenlaces" se posicionan de forma ABSOLUTA, y se ubican exactamente en donde luego deben aparecer, fijate:

Código:
.cenlaces {
position:absolute;
width: 765px;
top: 100px;
left:0px;
visibility:hidden;
font-size:8pt;
font-family : verdana,arial,helvetica;
font-weight: bold;
color : #333333;
background-color:#F6F6FF;
padding-top:1px;
padding-bottom:1px;
padding-left:3px;
clip: rect(0,765,16,0);
text-align:left;
}
Así se evita que ocupen más espacio del necesario, es ahí donde está la diferencia con lo que vos estás haciendo, y es eso lo que tenés que agregar a tu hoja de estilos. (no exactamente igual, claro, pero adaptándolo)


Saludos.
  #4 (permalink)  
Antiguo 26/05/2006, 16:38
 
Fecha de Ingreso: mayo-2006
Mensajes: 2
Antigüedad: 11 años, 6 meses
Puntos: 0
Gracias, voy a probar y te comento como me fué!
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 09:34.