Foros del Web » Creando para Internet » CSS »

menu emergente con lista y slider

Estas en el tema de menu emergente con lista y slider en el foro de CSS en Foros del Web. Hola, tengo un problema con un menu emergente hecho con css y un slider a continuación del menú hecho con css, jquery y jqFancytransitions. El ...
  #1 (permalink)  
Antiguo 04/06/2011, 13:31
 
Fecha de Ingreso: enero-2007
Mensajes: 30
Antigüedad: 10 años
Puntos: 2
menu emergente con lista y slider

Hola, tengo un problema con un menu emergente hecho con css y un slider a continuación del menú hecho con css, jquery y jqFancytransitions. El problema es que cuando se despliega el menu queda por debajo del slider. La organización css es la siguiente:

- Capa contenedora de la cabecera:
  • capa logo
  • capa menu
- Capa contenedora del slider:
  • capa slider

He probado con las propiedades z-index pero nada. Si le doy por ejemplo un z-index a la "capa contenedora de la cabecera" de 999 y a la "capa contenedora del slider" de -999 se sigue quedando el menú por debajo.

Si le doy a la "capa menu" un z-index de 999 y a la capa "slider" un -999 desaparece el slider y el menu si que se despliega.

He consultado foros y post sobre esto y parece que todo gira en torno al z-index, pero yo no logro dar con la "tecla". A ver si alguien me dar un poco de luz, gracias!!
  #2 (permalink)  
Antiguo 04/06/2011, 14:07
Avatar de Naahuel  
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 794
Antigüedad: 5 años, 10 meses
Puntos: 192
Respuesta: menu emergente con lista y slider

Bueno hay algo que debes tener en cuenta:

1.- Sólo puedes aplicar z-index a un elemento que tenga un valor de "position" diferente de static (absolute, relative o fixed). Me imagino que tus "capas" contenedoras" no tienen ninguno de esos posicionamientos.

2.- (no estoy muy seguro de esto, pero..) Tratá de usar valores de z-index positivos y no es necesario ser tan extremista con los valores. Usar 100 y 200 por ejemplo está perfecto. Había leído alguna vez que los navegadores que respetaban los estándares de CSS2 posicionaban un elemento con z-index negativo debajo del <body> haciendo que "desaparezca".

Tené en cuenta esas consideraciones. Aplicá un z-index mayor a los elementos dentro de tu menú que tengan un posicionamiento absoluto o relativo y uno menor a los elementos de tu slider que también estén con relative o absolute.


Si eso no funciona (porque algo te está faltando) probá lo siguiente:

Código CSS:
Ver original
  1. Capa contenedora de la cabecera{
  2. position:relative;
  3. z-index:200;
  4. }
  5.  
  6.  Capa contenedora del slider{
  7. position:relative;
  8. z-index:100;
  9. }
__________________
nahueljose.com.ar
  #3 (permalink)  
Antiguo 05/06/2011, 13:09
 
Fecha de Ingreso: enero-2007
Mensajes: 30
Antigüedad: 10 años
Puntos: 2
Respuesta: menu emergente con lista y slider

Cita:
Iniciado por Naahuel Ver Mensaje
Bueno hay algo que debes tener en cuenta:

1.- Sólo puedes aplicar z-index a un elemento que tenga un valor de "position" diferente de static (absolute, relative o fixed). Me imagino que tus "capas" contenedoras" no tienen ninguno de esos posicionamientos.

2.- (no estoy muy seguro de esto, pero..) Tratá de usar valores de z-index positivos y no es necesario ser tan extremista con los valores. Usar 100 y 200 por ejemplo está perfecto. Había leído alguna vez que los navegadores que respetaban los estándares de CSS2 posicionaban un elemento con z-index negativo debajo del <body> haciendo que "desaparezca".

Tené en cuenta esas consideraciones. Aplicá un z-index mayor a los elementos dentro de tu menú que tengan un posicionamiento absoluto o relativo y uno menor a los elementos de tu slider que también estén con relative o absolute.


Si eso no funciona (porque algo te está faltando) probá lo siguiente:

Código CSS:
Ver original
  1. Capa contenedora de la cabecera{
  2. position:relative;
  3. z-index:200;
  4. }
  5.  
  6.  Capa contenedora del slider{
  7. position:relative;
  8. z-index:100;
  9. }
pues muchas gracias, solucionado!! llevabas razón con la aplicación del z-index y el tipo de las capas. Las tenía en formato predeterminado. Sólo después de ponerlas en "relative" me ha empezado a funcionar el z-index.

Gracias!!

Etiquetas: emergente, lista, slider
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 08:45.