Definir objetos Flash embebidos en html con SWFOBJECT

Existe una libreria para embeber contenido flash en html llamada SWFOBJECT, como ventajas destacadas de incrustar flash por este metodo son:

  1. Es muy fácil de insertar, mas sencillo que incluir las etiquetas object, es una solución respetuosa con los estándares, y es común para todos los navegadores.
  2. Evita el tener que hacer clic sobre el objeto flash para activarlo en las últimas versiones de Internet Explorer.
  3. Nos permite incluir un contenido «alternativo» accesible para usuarios que no tengan flash player o naveguen con JavaScript deshabilitado.
  4. Google y otros motores de búsqueda son capaces de leer e indexar ese contenido alternativo perfectamente.

Consiste en definir un div en el sitio deseado del codigo html (teniendo sincronizacion con la plantilla css y el lugar que deseemos) con un id. este div contendra el texto alternativo (o maquetacion) que sera mostrado en el caso de que no dispongamos de flash instalado en nuestro dispositivo o pc.

 < div id="contenidoflash"> Contenido alternativo < /div>

Una vez definido este div pasamos a importar el script de SWFOBJECT de la siguiente forma:

 < script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js">< /script>

una vez importado continuamos con el siguiente paso, consiste en crear un objeto de la clase SWFOBJECT y darle sus propiedades e imprimirlo:

 < script type="text/javascript"> var so = new SWFObject("flashAnimacion.swf", "[idDelFlash]", "width", "height", "[version minima requerida de flash, ejemplo: 8.0.0]"); so.addParam("wmode", "transparent"); so.write("contenidoflash"); < /script>

Con este ultimo paso descrito anteriormente el resultado sera que cuando se cargue la pagina que contiene el flash nos aparece el flash embebido con SWFOBJECT siempre que flash este instalado y la ruta del archivo flash sea la correcta, en el caso contrario se mostrara el texto que contiene el div contenidoFlash. Otra forma de hacer esto mismo sin necesidad de crear el objeto SWFOBJECT es la siguiente:

  1. Creamos el div en el archivo html o php donde deberia ir el flash
  2. Colocamos el script de importacion y el de sustitucion en el index.php(el de la plantilla en el caso de joomla y wordpress)
  1.  < div id="contenidoflash"> Contenido alternativo < /div>
  2. Este paso cambia con respecto al anterior un poco en relacion a como se crea el script para embeber el flash:
    • Importamos el script:
       < script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js">< /script>
    • Creamos el script:
       < script type="text/javascript"> var flashvars = {nombre:""}; var params = {wmode:"transparent"}; swfobject.embedSWF("images/flash/entrada.swf", "[idDelFlash]", "width", "height", ""[version minima requerida de flash, ejemplo: 8.0.0]"","",flashvars,params); < /script>

En este ultimo paso vemos que no creamos un objeto, sino llamamos al metodo de la clase SWFOBJECT directamente para que sea sustituido. Nota*:El id del flash debe ser el mismo que el id del div, de forma que se sustituya en el div correcto. El div debe ir en la pagina donde deberia estar el flash y el script siempre en el index, esto es a diferencia del primero metodo explicado anteriormente Para este ultimo metodo existe una lista de parametros comunes que podemos definir, aqui van unos cuantos:

  1. menu: «true» o «false»
  2. quality: «low», «autolow», «autohigh», «medium», «high», «best»
  3. scale: «showall», «noborder», «exactfit», «noscale»
  4. salign: «l», «t», «r», «b», «tl», «tr», «bl», «br»
  5. wmode: «window», «opaque», «transparent»
  6. bgcolor: «FFFFFF» por ejemplo

Estos parametros se definen como en el ejemplo: so.addParam para el primer caso y var params = {wmode:»transparent»,xxx…}; para el segundo caso.

¿Te ha gustado el artículo?
1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (2 votos, promedio: 4,50 sobre 5)
Loading...

Suscríbete. Déjanos tu email y recibe contenido genial cada mes


Artículo escrito por

¡Exprésate! Dejanos tu comentario

Tu dirección de correo electrónico no será publicada.



Aún no hay comentarios en esta entrada. ¿Te animas?