swf - flash en html5
¿Cómo incrustar un archivo SWF en una página HTML? (13)
¡Este funcionará, estoy seguro!
<embed src="application.swf" quality="high" pluginspage="http://www.macromedia.com/go/getfashplayer" type="application/x-shockwave-flash" width="690" height="430">
¿Cómo incrusta un archivo SWF en una página HTML?
¿Cuál es la mejor manera? Las palabras como "más eficiente", "renderización más rápida", etc. son más específicas. De todos modos, estoy ofreciendo una respuesta alternativa que me ayuda la mayor parte del tiempo (si es o no es "lo mejor" es irrelevante).
Respuesta alternativa: use un iframe.
Es decir, aloja el archivo SWF en el servidor. Si coloca el archivo SWF en la carpeta raíz o public_html, el archivo SWF se ubicará en www.YourDomain.com/YourFlashFile.swf
.
Luego, en su index.html o en cualquier otro lugar, vincule la ubicación anterior a su iframe y se mostrará alrededor de su contenido donde sea que coloque su iframe. Si puede colocar un iframe allí, puede colocar allí un archivo SWF. Haga que las dimensiones del marco flotante coincidan con su archivo SWF. En el siguiente ejemplo, el archivo SWF es de 500 por 500.
Pseudo código:
<iframe src="//www.YourDomain.com/YourFlashFile.swf" width="500" height="500"></iframe>
La línea de código HTML de arriba incrustará su archivo SWF. No es necesario otro desastre. Pros: Compatible con W3C, diseño de página amigable, sin problemas de velocidad, enfoque minimalista.
Contras: espacio en blanco alrededor de su archivo SWF cuando se inicia en un navegador.
Esa es una respuesta alternativa. Si es la "mejor" respuesta depende de su proyecto.
¿Qué hay de la inserción de etiqueta HTML5 simple?
<!DOCTYPE html>
<html>
<body>
<embed src="anim.swf">
</body>
</html>
Como se mencionó SWF Object es genial. UFO vale la pena mirar también
El mejor enfoque para insertar un archivo SWF en una página HTML es usar SWFObject .
Es una biblioteca de JavaScript de código abierto simple que es un método fácil de usar y amigable con las normas para incrustar contenido Flash.
También ofrece la detección de la versión de Flash Player. Si el usuario no tiene la versión requerida de Flash o tiene JavaScript desactivado, verá un contenido alternativo. También puede usar esta biblioteca para activar una actualización de Flash Player. Una vez que el usuario se haya actualizado, será redirigido a la página.
Un ejemplo de la documentación:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>SWFObject dynamic embed - step 3</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0");
</script>
</head>
<body>
<div id="myContent">
<p>Alternative content</p>
</div>
</body>
</html>
Una buena herramienta para usar junto con esto es el generator HTML y JavaScript de SWFObject. Básicamente genera el HTML y JavaScript que necesita para incrustar el Flash usando SWFObject. Viene con una interfaz de usuario muy simple para que ingrese sus parámetros.
Es altamente recomendado y muy simple de usar.
Esto es adecuado para la aplicación desde el entorno raíz.
<object type="application/x-shockwave-flash" data="/dir/application.swf"
id="applicationID" style="margin:0 10px;width:auto;height:auto;">
<param name="movie" value="/dir/application.swf" />
<param name="wmode" value="transparent" /> <!-- Or opaque, etc. -->
<!-- ↓ Required paramter or not, depends on application -->
<param name="FlashVars" value="" />
<param name="quality" value="high" />
<param name="menu" value="false" />
</object>
Se deben agregar / se pueden agregar parámetros adicionales que dependen de .swf self. Sin incrustaciones , solo objeto y parámetros dentro, por lo tanto, sigue siendo válido, funcional y utilizable en cualquier lugar, no importa de qué se trata. DOCTYPE. :)
Esto funcionó para mí:
<a target="_blank" href="{{ entity.link }}">
<object type="application/x-shockwave-flash" data="{{ entity.file.path }}?clickTAG={{ entity.link }}" width="120" height="600" style="visibility: visible;">
<param name="quality" value="high">
<param name="play" value="true">
<param name="LOOP" value="false">
<param name="wmode" value="transparent">
<param name="allowScriptAccess" value="true">
</object>
</a>
Puedes usar JavaScript si estás familiarizado, así:
swfobject.embedSWF("filename.swf", "Title", "width", "height", "9.0.0");
--the 9.0.0 es la versión flash.
O puede usar la etiqueta <object>
de HTML5.
Sé que esta es una vieja pregunta. Pero esta respuesta será buena para el presente.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>histo2</title>
<style type="text/css" media="screen">
html, body { height:100%; background-color: #ffff99;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
</head>
<body>
<div id="flashContent">
<object type="application/x-shockwave-flash" data="histo2.swf" width="822" height="550" id="histo2" style="float: none; vertical-align:middle">
<param name="movie" value="histo2.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffff99" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</object>
</div>
</body>
</html>
Si está utilizando una de esas bibliotecas js para insertar Flash, le sugiero agregar una etiqueta de <noscript/>
objetos simples dentro de <noscript/>
.
Utilizo http://wiltgen.net/objecty/ , ayuda a incrustar contenido multimedia y evitar el problema de "hacer clic para activar" de IE.
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/VhtIydTmOVU&hl=en&fs=1&color1=0xe1600f&color2=0xfebd01"
style="width:640px;height:480px;margin:10px 36px;">
<param name="movie" value="http://www.youtube.com/v/VhtIydTmOVU&hl=en&fs=1&color1=0xe1600f&color2=0xfebd01" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="wmode" value="opaque" />
<param name="quality" value="high" />
<param name="menu" value="false" />
</object>
<object width="100" height="100">
<param name="movie" value="file.swf">
<embed src="file.swf" width="100" height="100">
</embed>
</object>