Foros del Web » Creando para Internet » CSS »

menú desplegable, se oculta

Estas en el tema de menú desplegable, se oculta en el foro de CSS en Foros del Web. hola, tengo un menú a la izquierda que se despliega hacia la derecha cuando tengo el ratón encima, hasta aquí todo bien, el problema es ...
  #1 (permalink)  
Antiguo 10/03/2010, 02:58
 
Fecha de Ingreso: marzo-2009
Mensajes: 509
Antigüedad: 8 años, 9 meses
Puntos: 17
menú desplegable, se oculta

hola, tengo un menú a la izquierda que se despliega hacia la derecha cuando tengo el ratón encima, hasta aquí todo bien, el problema es que a la derecha tengo un mapa de google maps, y el menú me queda debajo del mapa, con lo que no se ve.

¿hay alguna opción de decirle que la capa va por encima de todo lo demás?

No pongo el código porque supongo que es añadir una opción, si creeís que es necesario decidme y lo hago!

Saludos!
  #2 (permalink)  
Antiguo 10/03/2010, 03:41
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: menú desplegable, se oculta

Prueba añadiendo z-index:1; al menú. Debe funcionar.

Saludos¡¡
__________________
Revisa las FAQ's antes de disparar.
  #3 (permalink)  
Antiguo 12/03/2010, 10:46
 
Fecha de Ingreso: marzo-2009
Mensajes: 509
Antigüedad: 8 años, 9 meses
Puntos: 17
Respuesta: menú desplegable, se oculta

Hola, pues no me funciona. Este es mi css, ¿donde debería ponerlo?

Código:
#general {
	overflow:hidden; 
	width:100%; 
	margin-left:3%;
}

#map {
	margin-left:260px;
	margin-top:40px;
	width: 825px;
	height: 500px;
 	border-color: #000;
	border-style: solid;
	
}

#menu {
	float:left;
	margin-top:25px;
	width: 240px;
	}

#menu li { /* Esto evita que salgan los iconos de lista */
	list-style:none;
}

	

#menu li a { /* Esto evita que los enlaces salgan subrayados */
  	text-decoration: none;
}


#menu ul li {
	position:relative; /* Las coordenadas de los ul inferiores serán relativas al <li> que los contiene */
	width:200px;
}



#menu li a:link, #menu li a:visited{ /* Estilo del menú de primer nivel */
	color: #9E3C02;
	display: block;
	background: url(menu/menu.gif);
	padding: 8px 0 0 30px;
}

#menu li a:hover{ /* Estilo del menú de primer nivel al tener el ratón sobre un elemento */
	color: #fff;
	background: url(menu/menu.gif) 0 -32px;
	padding: 8px 0 0 30px;
}

#menu li a:active, #menu li.activo a{ /* Estilo del menú de primer nivel al estar pulsando con el ratón o estar seleccionado */
	color: #fff;
	background: url(menu/menu.gif) 0 -64px;
	padding: 8px 0 0 30px;
}

#menu li.falso { /* Sólo para que visualmente parezcan dos menús y se muevan a la vez */
	padding: 30px 0 0 30px;
}

#menu ul.segundoNivel{ /* Estilo del menú de segundo nivel */	
	position:absolute; /* Esta posición es relativa al <li> que contiene a este <ul> */
	left:200px; /* Para que no monte sobre el <li> */
   	top:0px;
	display:none;	
	padding: 0 0 0 0;
}

#menu ul li:hover > ul{ /* Al tener el ratón sobre algún nivel se abre el siguiente*/
	display:block;
}

#menu ul.tercerNivel{ /*Estilo del menú del tercer nivel */
	display: none;	
	position:absolute; /* Esta posición es relativa al <li> que contiene a este <ul> */
	left:200px; /* Para que no monte sobre el <li> */
   	top:0px;
	/*height: 100px;*/
	font : 55% sans-serif;
	padding: 0 0 0 0;
}
Perdón por el rollo, pero es que no tengo ni idea!

Gracias!
  #4 (permalink)  
Antiguo 12/03/2010, 12:03
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: menú desplegable, se oculta

Prueba añadiendoselo a #menu

Saludos¡¡
__________________
Revisa las FAQ's antes de disparar.
  #5 (permalink)  
Antiguo 15/03/2010, 02:28
 
Fecha de Ingreso: marzo-2009
Mensajes: 509
Antigüedad: 8 años, 9 meses
Puntos: 17
Respuesta: menú desplegable, se oculta

Hola, gracias por tu interés, pero no funciona, sigue igual, el menú se despliega detrás del mapa y no veo nada.

¿Alguna otra posibilidad?

Gracias!
  #6 (permalink)  
Antiguo 15/03/2010, 02:44
 
Fecha de Ingreso: marzo-2009
Mensajes: 509
Antigüedad: 8 años, 9 meses
Puntos: 17
Respuesta: menú desplegable, se oculta

Ya lo he conseguido! leyendo por ahí he visto que la propiedad z-index sólo funciona si position está establecido a relative o absolute, así que se lo añadí y perfecto!

Gracias!!! Saludos!
  #7 (permalink)  
Antiguo 15/03/2010, 05:38
 
Fecha de Ingreso: enero-2007
Mensajes: 17
Antigüedad: 10 años, 11 meses
Puntos: 0
Respuesta: menú desplegable, se oculta

z-index:99999 o lo mejor es modificar el codigo del mapa que debe ser en flash agregandole wmode="transparent"
  #8 (permalink)  
Antiguo 22/11/2013, 23:16
 
Fecha de Ingreso: noviembre-2013
Mensajes: 1
Antigüedad: 4 años
Puntos: 0
Mensaje Respuesta: menú desplegable, se oculta

Hey! aqui... yo buscaba el mismo problema y lo resolví así, solo es colocando lo que te dicen pero en esta etiqueta de "css":


#menu li:hover {
background:#DFDFDF;
/* AQUI SE ARREGLA MENU DESLGBL X/ENCIMA */
z-index: 1 !important;
display: block;
position: relative;
}

Nota: es importante colocarlo en la etiqueta LI:HOVER creo que asi funcionara


"EL verdadero progreso consiste en renovarse" Alejandro Vinnet
[URL="http://adquieretuweb.com"]http://adquieretuweb.com[/URL]

Etiquetas: desplegable, oculta
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 17:20.