Flash oculta ventana flotante

JinSunMi · #1 (**permalink**) 28/06/2010, 10:34

Hola chicos
He puesto este problema en el subforo de javascript pero creo que debí hacerlo en html, si rompo alguna norma por favor disculpen, no sé si estoy infringiendo alguna,

Hice una tabla y la dividí en dos celdas
en la celda izquierda puse un logotipo pequeño hecho en flash
en la celda derecha puse un código javascript que me permite abrir una ventana flotante con una imagen haciendo click previamente en un thumbnail

PROBLEMA
la película flash del logotipo sale encima de la ventana flotante y tapa parte de la imagen
¿Como lo soluciono?
les agradeceré mucho su ayuda
gracias
Jin

fermar21 · #2 (**permalink**) 28/06/2010, 12:30

Ponle al swf la propiedad wmode = transparent

all-ill · #3 (**permalink**) 28/06/2010, 16:02

Primero prueba si te funciona añadiendo el parámetro wmode en el objeto y embed de flash:
Por un lado: <param name="wmode" value="opaque"></param>
Por otro lado y dentro del la etiqueta embed: wmode="opaque"
Si con opaque no te funciona puedes probar con transparent
Si con eso no te funciona entonces prueba con la propiedad z-index de CSS.

http://www.forosdelweb.com/f91/ayuda...9/#post3455453

Cita:

Iniciado por all-ill

Se trata de combinar el parámetro wmode="transparent" o wmode="opaque" (quizá mejor usar opaque porque creo que hace trabajar menos a flash, por lo de no tener que interpretar el canal alpha...) de flash con la propiedad z-index de CSS.
Pongo un ejemplo que acabo de hacer (para otros ejemplos, por si me dejo algo, puedes buscar en Internet, creo que lo llaman css overlap):

Código HTML:

Ver original<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Ejemplo capa superpuesta sobre animaciones flash</title>
    <link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8" />
    
</head>
<body>
    <div class="overlap">capa superpuesta</div>
    <div><object width="640" height="385"><param name="movie" value="http://www.youtube-nocookie.com/v/ziDeUbifKIM&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube-nocookie.com/v/ziDeUbifKIM&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385" wmode="transparent"></embed></object></div>
</body>
</html>

Código CSS:

Ver original.overlap{z-index:1000;height:200px; width:250px; background-color:black; position:absolute; left:500px; top:100px; color:white; text-align:center; font-size:2em;overflow:hidden;}

El primer punto importante es la propiedad z-index. La de la capa que quieras poner por encima de otras debe tener un z-index superior a las demás.
El otro punto a destacar es la inclusión del parámetro wmode en el código usado para cargar el archivo de flash. En el código que he copiado de youtube he añadido lo siguiente:
<param name="wmode" value="transparent"></param>
y dentro de la etiqueta embed wmode="transparent"
Aunque en lugar de transparent se puede usar opaque.