saltar intro

carguen, apunten, this._parent

html delante de flash

with 28 comments

Cuando se mezcla flash y html en la misma página, el archivo flash tiene la mala costumbre de colocarse siempre encima del maquetado html por mucho que le digamos que está en un div con el z-index por debajo.

La solución a este comportamiento pasa por declarar en el object/embed del código que contiene el flash, el parámetro wmode con el valor ‘transparent’ y asunto arreglado.

Este parámetro sirve para eliminar el fondo de color del propio flash y dejarlo transparente. Se ha utilizado mucho para hacer aparecer publicidad en medio de una web. El caso es que también nos resuelve esa manía de aparecer siempre delante.

De esta manera un flash se puede converitr en el fondo animado de una página maquetada en html puro y duro.

Written by sergiomas

enero 27th, 2006 at 8:48 pm

Posted in Flash

28 Responses to 'html delante de flash'

Subscribe to comments with RSS or TrackBack to 'html delante de flash'.

  1. Mil gracias tio, llevaba dos días rompiéndome el coco… se que puede parecer tonto pero para aquellos que empezamos con esto del flash nos es de gran ayuda estas pequeñas puntillas de información que nos dan el justo toque nos faltaba para poder terminar de maquetar nuestros trabajillos…

    Un abrazo enorme… se que parezco demasiado efusivo pero después de dos días de búsqueda continua y lectura de cientos de manuales y tutoriales (algunos ya por cansancio a ojillo) que encuentres la solución explicada de una manera simple y clara se agradece…

    bueno no sigo mas, solo dcirte de nuevo gracias

    nos vemos

    Antonio

    8 dic 06 at 5:17 pm

  2. … de nada. ;-)

    Conozco esa sensación de tirarte de los pelos días enteros hasta que ves la luz.

    Administrator

    8 dic 06 at 5:25 pm

  3. test

    Mexxbx

    19 abr 07 at 1:24 am

  4. si pero la solución que yo necesito es modificar el html para que se ponga encima del flash y no el flash para que se ponga debajo.
    Reto a ver quien me soluciona esto porque lo veo imposible.
    basicamente imaginaos que no teneis control sobre el flash y hay que montarle un div html encima. jejejejee. Ya no es tan facil verdad?

    carlos

    20 ago 07 at 11:54 pm

  5. En realidad el flash no lo modificas, si no el código html que incrusta el swf en la página.
    Si nos das más detalles de tu caso quizás podamos ayudarte.

    Administrator

    31 ago 07 at 8:25 am

  6. hola quisiera saber en que lugar se pone el parámetro wmode porque no lo se. saludos!

    matias

    13 sep 07 at 3:33 am

  7. Pues se coloca dentro del tag OBJECT, a continuación de los demás parámetros, con el formato:

    param name=”wmode” value=”transparent”

    y también dentro del tag EMBED, con el formato:

    wmode=”transparent”

    Administrator

    13 sep 07 at 5:51 am

  8. Ojo, que el parámetro WMODE tiene diferentes valores.

    Administrator

    13 sep 07 at 5:52 am

  9. Por favor alguien que pueda ayudarme, estoy empezando a realizar una pagina web e hice una imagen en flash pero no se como poner la imagen para que me aparezca en mi pagina de html

    yaneth

    3 oct 07 at 9:16 pm

  10. Si es sólo una imagen no te aconsejo que sea en flash, y si es una animación la manera más fácil de insertar el código es copiarlo de otra web que tenga un flash y cambiarle los parámetros de ruta, ancho y alto, básicamente.

    Administrador

    4 oct 07 at 8:51 am

  11. Yo quiero que el flash apunte a una página pero quiero hacerlo con el html y no dentro del flash, algo asi

    Eso funciona en firefox, pero en IExplorer no…además con la versión 7 de IE me muestra el mensaje que debo darle click para activar el control.
    ¿Alguna idea?

    Milko

    23 ene 08 at 3:02 am

  12. El código del mensaje anterior


    Milko

    23 ene 08 at 3:03 am

  13. La manera de hacerlo sería colocar el flash dentro de la etiqueta de enlace (<a>).
    Al flash darle el parámetro wmode igual a transparent para que se sitúe por detrás del enlace, y si no funciona, usar CSS para convertir el enlace en elemento de bloque, darle posición absoluta, y especificar su ancho y alto igual al del flash.

    No lo he probado pero creo que funcionará.

    Administrator

    23 ene 08 at 2:57 pm

  14. No funciona

    Diego

    25 sep 08 at 1:26 pm

  15. Aquí va un ejemplo de un enlace en un texto html, con un flash por debajo.
    http://saltarintro.com/pruebas/htmlsobreflash/

    sergiomas

    25 sep 08 at 4:40 pm

  16. pero no funciona para todos los navegadores, IE fenomeno pero par Firefox nada e nada

    antonio

    2 dic 08 at 2:40 pm

  17. A mi si me funciona en firefox.

    sergiomas

    2 dic 08 at 2:48 pm

  18. Si que va perfecto, muchas gracias! Lo malo es que no se pueda interactuar con el flash y el html a la vez… solo me funcionan los botones de lo que esta delante… :(

    nanel

    1 feb 09 at 3:27 pm

  19. @ nanel
    Cierto. Y además hay que tener cuidado con los navegadores por que se comportan de forma diferente.

    sergiomas

    1 feb 09 at 9:31 pm

  20. Gracias Maestro por compartir esta información, no lo había captado al inicio, ya que hay un embed y hay un object y en ambos hay que poner la opción, sino, no funciona.

    Cesar Garcia

    25 feb 09 at 11:29 pm

  21. para los que ejecutan swfobjeb
    ///////////////////entre bodys///////////////////////

    texto advertencia

    var so = new SWFObject(“script/ARchibo.swf”, “nombre”, “500″, “480″, “8″)
    so.addParam(“quality”, “high”);
    so.addParam(“wmode”, “transparent”);
    so.addParam(“scale”, “noscale”);
    so.addParam(“salign”, “l”);
    so.addParam(“bgcolor”, “#f4f5f7″);
    so.write(“contenido”);
    //////////////////////////////////////////

    rowilson

    15 abr 09 at 11:30 pm

  22. Gracias por el tip. :-D

    sergiomas

    16 abr 09 at 6:52 am

  23. Hola SErgio .. tengo basicamente el mismo problema del swf encima de un #menu … coloque el valor zindex e inserte el parametro de transparent como indica arriba este es el codigo de mi flash … si puedes corrigueme si ves algun error … gracias!

    AC_FL_RunContent( ‘codebase’,’http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','960','height','153','src','encabezado','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','encabezado‘ ); //end AC code

    Fabiola

    3 nov 09 at 10:49 pm

  24. sergiomas Muchisimas gracias! Me sirvio tu ejemplo que pusiste amablemente en la web
    http://saltarintro.com/pruebas/htmlsobreflash/
    GRacias
    y saludos

    DaronWolff

    14 feb 10 at 7:40 pm

  25. Thks man :D

    CarlosV

    4 mar 10 at 7:35 pm

  26. Hola,
    perdon por insistir pero, como a Antonio, me funciona en iexplorer pero no en firefox. Ya he intentado todo lo que habeis dicho, que puedo hacer?
    Gracias!

    Pilar

    19 mar 10 at 12:41 am

  27. Hola Pilar
    El flash va dentro de una etiqueta ‘Object’, y dentro de ella está la etiqueta ‘embed’.
    Esta última es la que obedece Firefox.
    Mira a ver si tambien incluye el parámetro wmode=”transparent”.

    Saludos

    sergiomas

    19 mar 10 at 1:50 pm

  28. Hola Sergio, en mi caso lo que comentas me funciona parcialmente. Lo que quiero hacer es colocar en la página un flash que sea un enlace a otra página. Para ello he colocado el flash y, sobre éste, un enlace del mismo tamaño que el flash. Me funciona en Firefox pero no en IE. He probado lo que comentas y funciona en parte. El flash consiste en un texto que cambia de color, y ahora el enlace está disponible en la zona del flash donde no hay letras pero no si pongo el cursor sobre las letras. Se ha quedado transparente el fondo del flash, pero no las zonas donde hay texto… se te ocurre cómo podría resolverlo?
    Muchísimas gracias.

    Alberto

    28 oct 10 at 11:16 am

Leave a Reply