CODIGO.actionscript » swfobject http://www.codigoactionscript.org Blog de programación en ActionScript. Tips, tutoriales, ejemplos de Adobe Flash, Flex y AIR Fri, 30 Sep 2011 11:25:38 +0000 en hourly 1 http://wordpress.org/?v=3.3 Visualizar menús desplegables HTML por encima de películas Flash http://www.codigoactionscript.org/visualizar-menus-desplegables-html-por-encima-de-peliculas-flash/ http://www.codigoactionscript.org/visualizar-menus-desplegables-html-por-encima-de-peliculas-flash/#comments Fri, 31 Jul 2009 20:29:44 +0000 admin http://www.codigoactionscript.org/?p=526 Este es otro tip "only for dummies", que es muy sencillo pero que da dolores de cabeza a la gente que apenas se inicia en el mundo de Ajax únicamente utilizando los códigos automáticos de Spry que trae Dreamweaver.

El problema que muchos se encuentran es que los menús desplegables les quedan por debajo de las peliculas Flash, aun estando está en un index inferior.

Esto tiene una solución muy sencilla, y pasa por añadirle la propiedad wmode de la pelicula Flash a valor invisible.

De manera que si estamos utilizando SwfObject para [...] Related posts:

  1. Sustituir un SWF por otro sin refrescar el HTML con Ajax
  2. Texto con enlaces en Flash al estilo HTML
  3. El nuevo motor de texto (Text Layout Framework) de Flash CS5
]]> Este es otro tip "only for dummies", que es muy sencillo pero que da dolores de cabeza a la gente que apenas se inicia en el mundo de Ajax únicamente utilizando los códigos automáticos de Spry que trae Dreamweaver.

El problema que muchos se encuentran es que los menús desplegables les quedan por debajo de las peliculas Flash, aun estando está en un index inferior.

Esto tiene una solución muy sencilla, y pasa por añadirle la propiedad wmode de la pelicula Flash a valor invisible.

De manera que si estamos utilizando SwfObject para colocar el SWF, utilizariamos este código:

PLAIN TEXT
Actionscript:
  1. <script type="text/javascript">  
  2.        var flashvars = {};
  3.        var params = {};
  4.        var attributes = {};
  5.        params.wmode = "transparent";
  6.        swfobject.embedSWF("a.swf", "flash", "320", "240", "10.0.0", "expressInstall.swf", flashvars, params, attributes);
  7. </script>

Esta línea de código es suficiente para resolver el problema.

Aqui el ejemplo, por si alguien lo quiere ver ;)

Related posts:

  1. Sustituir un SWF por otro sin refrescar el HTML con Ajax
  2. Texto con enlaces en Flash al estilo HTML
  3. El nuevo motor de texto (Text Layout Framework) de Flash CS5

]]> http://www.codigoactionscript.org/visualizar-menus-desplegables-html-por-encima-de-peliculas-flash/feed/ 8 Sustituir un SWF por otro sin refrescar el HTML con Ajax http://www.codigoactionscript.org/sustituir-un-swf-por-otro-sin-refrescar-el-html-con-ajax/ http://www.codigoactionscript.org/sustituir-un-swf-por-otro-sin-refrescar-el-html-con-ajax/#comments Thu, 30 Jul 2009 23:16:11 +0000 admin http://www.codigoactionscript.org/?p=519 En este sencillo ejemplo mostraré como sustituir un archivo SWF de una página HTML por otro sin necesidad de refrescar la página. (ejemplo)

Para ello utilizaremos SwfObject y JQuery. En realidad JQuery no haria falta utilizarlo ya que quien sustituirá el SWF será SwfObject y podriamos hacer la llamada con una simple funcion Javascript. Pero nunca está de más ver un poco de Ajax

Para empezar nos descargaremos las librerias:

http://code.google.com/p/swfobject/downloads/list http://docs.jquery.com/Downloading_jQuery#Download_jQuery

. Lo primero será colocar nuestra pelicula SWF dentro de la página HTML con SwfObject de la forma típica. Creando una DIV y [...] Related posts:

  1. Visualizar menús desplegables HTML por encima de películas Flash
  2. Texto con enlaces en Flash al estilo HTML
]]> En este sencillo ejemplo mostraré como sustituir un archivo SWF de una página HTML por otro sin necesidad de refrescar la página. (ejemplo)

Para ello utilizaremos SwfObject y JQuery. En realidad JQuery no haria falta utilizarlo ya que quien sustituirá el SWF será SwfObject y podriamos hacer la llamada con una simple funcion Javascript. Pero nunca está de más ver un poco de Ajax

Para empezar nos descargaremos las librerias:

.
Lo primero será colocar nuestra pelicula SWF dentro de la página HTML con SwfObject de la forma típica. Creando una DIV y asignandole ahí la pelicula SWF. Lo haremos creando una función que reciba el parámetro de la URL del SWF para poder volver a llamar esa función más adelante:

PLAIN TEXT
Actionscript:
  1. <script src="swfobject.js" type="text/javascript"></script> <script type="text/javascript">// <![CDATA[
  2.             function putSWF(swf){
  3.                 swfobject.embedSWF(swf, "flash", "320", "240", "10.0.0", "expressInstall.swf");
  4.             };
  5.             putSWF("a.swf");
  6.  
  7. // ]]></script>

Ahora crearemos unos cuantos links con los que queremos cambiar de pelicula SWF pero sin cambiar de página HTML. Los colocaremos en otro DIV y asignaremos a cada enlace un ID diferente:

PLAIN TEXT
Actionscript:
  1. <div id="botonera">
  2.  
  3. <a id="a" href="#">a.swf</a>
  4. - <a id="b" href="#">b.swf</a>
  5. - <a id="c" href="#">c.swf</a></div>

Podríamos hacer que cada enlace volviera a ejecutar la función Javascript y listo, pero haremos el ejemplo más c00l utilizando JQuery.

Primero definiremos un objeto en el que guardaremos una relación entre los ID de los enlaces y la pelicula SWF que han de abrir.

PLAIN TEXT
Actionscript:
  1. var swfRef = {
  2. a: "a.swf",
  3. b: "b.swf",
  4. c: "c.swf"
  5. };

Y por último crearemos una función de JQuery que asignará a cada enlace la llamada a la función Javascript pasandole el parámetro que toca. Tambien sustituiremos la primera llamada.

PLAIN TEXT
Actionscript:
  1. $(function(){
  2. $.each(swfRef, function(i, val){
  3. $("#" + i).click(function(){
  4. putSWF(val);
  5. });
  6. });
  7. $("#a").click();
  8. });

Y listo, ahora cada enlace sustituye el SWF por otro dentro de la misma página.

Aqui se puede ver el ejemplo: http://www.cristalab.com/zguillez/ajax/putswf/index.html

Y el código completo:

PLAIN TEXT
Actionscript:
  1. <html>
  2.     <head>
  3.         <script type="text/javascript" src="swfobject.js"></script>
  4.         <script src="lib/jquery/jquery-1.3.2.js"></script>
  5.         <script>
  6.             function putSWF(swf){
  7.                 swfobject.embedSWF(swf, "flash", "320", "240", "10.0.0", "expressInstall.swf");
  8.             };
  9.             var swfRef = {
  10.                 a: "a.swf",
  11.                 b: "b.swf",
  12.                 c: "c.swf"
  13.             };
  14.             $(function(){
  15.                 $.each(swfRef, function(i, val){
  16.                     $("#" + i).click(function(){
  17.                         putSWF(val);
  18.                     });
  19.                 });
  20.                 $("#a").click();
  21.             });
  22.         </script>
  23.     </head>
  24.     <body>
  25.         <div id="botonera">
  26.             <p>
  27.                 <a id="a" href="#">a.swf</a>
  28.                 - <a id="b" href="#">b.swf</a>
  29.                 - <a id="c" href="#">c.swf</a>
  30.             </p>
  31.         </div>
  32.         <div id="flash"></div>
  33.     </body>
  34. </html>

Related posts:

  1. Visualizar menús desplegables HTML por encima de películas Flash
  2. Texto con enlaces en Flash al estilo HTML

]]> http://www.codigoactionscript.org/sustituir-un-swf-por-otro-sin-refrescar-el-html-con-ajax/feed/ 4