elemento flash con Z-index

[idenmedia]

Hola

Necesito saber si se puede hacer esto (y como).

Quiero poner un archivo SWF con fondo transparente, sobre todo mi sitio HTML.
Lo hago sin problemas con la propiedad Z-index

al <div> contenedor del sitio lo pongo en cero y al <div> contenedor del SWF en uno mayor.

El tema es que al estar el SWF por delante, no me permite usar los links de la página de atrás.
Como hago para que no me tape los links?.

Saludos

[cristian_cena]

Pues create otra capa div con z-index=3 y coloca en él tus enlaces. xD.

Saludos!

[kenedi]

Hola Christian, podrias explicar como se hace eso?

Gracias.

[wilo087]

Hehehe esta bueno eso!.

cristian_cena se refiere a que utilices la propiedad z-index con un valor mayor en los enlaces.

<a href="mipagina.com" style="z-index:99">Inicio </a>
<a href="mipagina.com" style="z-index:99">Sobre nosotros </a>
<a href="mipagina.com" style="z-index:99">Contacto</a>
<a href="mipagina.com" style="z-index:99">etc </a>
<a href="mipagina.com" style="z-index:99">etc </a>


Esto deberia funcionarte

[cristian_cena]

Hola gente, idenmedia respondi tu email, asimismo adjunto aquí la respuesta para quien le sirva:

Hola jose, la lógica de trabajo es esta, luego tu la aplicas a lo que necesitas:

Los elementos que se quieran posicionar con z-index deben ser hermanos entre si y deben estar posicionado en relativo, absoluto o fijo

ej:

Código:

<div id="papa">
<div id="hijoatras">... el contenido que quieras ...</div>
<div id="hijomedio">... el contenido que quieras ...</div>
<div id="hijodelante">... el contenido que quieras <a href="#">soy un enlace</a> ...</div>
</div>

#papa{
position:relative: /*damos relative para que pase a ser el contenedor de elementos anidados con posicion absoluta y que la esquina sup-izq de #papa sea el punto 0,0 de coordenadas para los top-left-right-bottom de sus hijos anidados */
width:/*el que quieras*/;
height:/*el que quieras*/;
}
#hijoatras{
position:absolute;
z-index:1;
width:/*el que quieras*/;
height:/*el que quieras*/;
top:/*lo corres cuanto quieres*/;
left:/*lo corres cuanto quieres*/;
}
#hijomedio{
position:absolute;
z-index:2;
width:/*el que quieras*/;
height:/*el que quieras*/;
top:/*lo corres cuanto quieres cuidando que no halla ningun enlace detras ;)*/;
right:/*lo corres cuanto quieres cuidando que no halla ningun enlace detras ;)*/;
}
#hijodelante{
position:absolute;
z-index:3;
width:/*el que quieras*/;
height:/*el que quieras*/;
top:/*lo corres cuanto quieres cuidando que no halla ningun enlace detras ;)*/;
left:/*lo corres cuanto quieres cuidando que no halla ningun enlace detras ;)*/;
}

PD:
[jose me pregunta por email: Tengo otro error que es que por más que modifico el contenido de algunos artículos, no se hacen los cambios, no sé si eso tiene que ver algo…]
Respuesta:

cuando hagas cambios y nada cambie fijate que estes usando correctamente los selectores css, o sea a lo mejor en una id te comiste un # o te olvidaste de lagun ; q se yo cosas q pasan
asimismo tene en cuenta que si das estilo directamente en la etiqueta html estos son mas fuertes que los estilos que das desde un archivo.css externo.

En cualquier caso puedes incluir un !important para pisar estilos.

ej:

Código:

<p style="background:red;"> //el fondo sera rojo

p{background:blue !important;} // ahora el fondo sera azul.

--------------------------------------------------------------------------------------------------

aquí puedes encontrar un ejemplo de como trabaja z-index.

[cristian_cena]

gracias por responder idenmedia, saludos.

[jsanahuja]

Tengo un problema similar, tengo el siguiente código:

<style type="text/css">
#fondo{position:relative;width: 1000px; height: 700px;}
#flash1{position:absolute;left:444px;top:444px;z-index:1;}
#corona{position:absolute;left:444px;top:444px;z-index:2;}
</style>

En teoría #fondo es el contenedor de los otros 2, pero en cambio no me aparece la corona, por encima de la capa flash1, siempre me aparece por debajo.

¿Alguien me puede echar un cable?

Muchas Gracias a tod@s