Parece que incluir archivos de Flash siempre trae complicaciones. No es difícil pero nos lo hacen difícil porque cada servicio nos da instrucciones diferentes. Unos usan OBJECT, otros EMBED, otros ambas. Aparecen cosas misteriosas y crípticas como:
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
o:
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0"
Suelen ser códigos que ocupan varias líneas y ¡vaya uno a saber que dicen!
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
o:
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0"
Suelen ser códigos que ocupan varias líneas y ¡vaya uno a saber que dicen!
<object width="600" height="300" type="application/x-shockwave-flash" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0"><param name="movie" value="http://.../achivo.swf" /><param name="quality" value="high" /><embed src="http://.../achivo.swf" quality="high" type="application/x-shockwave-flash" width="600" height="300"></embed></object>
Veamos el más común, el que nos da YouTube:
<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/jkTNe85y0UI&hl=es&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/jkTNe85y0UI&hl=es&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>
¡Otra vez distinto!
Así que mejor colocarlos como están y listo pero claro, a veces no funcionan y entonces, más que asustarse, lo mejor es tratar de entenderlos y si lo conseguimos, nos daremos cuenta que ... no los necesitamos.
La etiqueta HTML para insertar archivos de Flash (SWFs, reproductores de audio, reproductores de video, etc) es OBJECT. Como toda etiqueta, se abre y se cierra:
Así que mejor colocarlos como están y listo pero claro, a veces no funcionan y entonces, más que asustarse, lo mejor es tratar de entenderlos y si lo conseguimos, nos daremos cuenta que ... no los necesitamos.
La etiqueta HTML para insertar archivos de Flash (SWFs, reproductores de audio, reproductores de video, etc) es OBJECT. Como toda etiqueta, se abre y se cierra:
<object .......> ....... </object>
Dentro de ella, se colocan parámetros, datos extras que son necesarios o que son optativos:
<object .......> <param name="NOMBRE" value="VALOR" /> </object>
Como PARAM es una etiqueta "sin contenido", no es necesario agregar la etiqueta de cierre </param> y es suficiente agregar la barra final en la misma etiqueta de apertura; es lo mismo que pasa con otras como <br /> <img ... /> <meta ... /> <input ... />
¿Y la etiqueta EMBED? La respuesta rápida es NO EXISTE . Es que en realidad, es un rezago del tiempo en que Microsoft y Netscape se mataban para crear funciones diferenciadas y cada uno inventaba algo que el otro copiaba pero con otro nombre. El resultado de esa guerra es la falta de estandarización y las incompatibilidades entre los navegadores. Si nos basamos en las recomendaciones de la w3org (y deberíamos hacerlo), EMBED es una etiqueta "prohibida" y, en este caso, no se trata de un capricho sino de simple comodidad ¿para qué escribir dos cosas si basta escribir una sola?
Es cierto que las diferencias entre navegadores hace que unos no interpreten lo mismo que los otros pero la etiqueta OBJECT contempla esa diferecencia así que es sencillo de resolver.
¿Y la etiqueta EMBED? La respuesta rápida es NO EXISTE . Es que en realidad, es un rezago del tiempo en que Microsoft y Netscape se mataban para crear funciones diferenciadas y cada uno inventaba algo que el otro copiaba pero con otro nombre. El resultado de esa guerra es la falta de estandarización y las incompatibilidades entre los navegadores. Si nos basamos en las recomendaciones de la w3org (y deberíamos hacerlo), EMBED es una etiqueta "prohibida" y, en este caso, no se trata de un capricho sino de simple comodidad ¿para qué escribir dos cosas si basta escribir una sola?
Es cierto que las diferencias entre navegadores hace que unos no interpreten lo mismo que los otros pero la etiqueta OBJECT contempla esa diferecencia así que es sencillo de resolver.
<object type="application/x-shockwave-flash" data="http://.../archivo" width="ANCHO" height="ALTO"> <param name="movie" value="http://.../archivo" /> </object>
Si tuviéramos que insertar un archivo de YouTube, bastarían esas tres líneas para que pudiéramos verlo:
type es un atributo obligatorio y le indica al navegador, cuál es el tipo de formato que debe incrustar
data es un atributo donde colocamos la URL del archivo a reproducir y ese dato es el que reemplaza a la etiqueta EMBED
width y height son el ancho y el alto del archivo (medido en pixeles) y son valores que podemos cambiar
En una etiqueta PARAM colocamos otra vez la URL del archivo a reproducir porque esa es la que leerá Internet Explorer.
Así que esto, mostraría un video de YouTube sin problemas; más corto, imposible:
type es un atributo obligatorio y le indica al navegador, cuál es el tipo de formato que debe incrustar
data es un atributo donde colocamos la URL del archivo a reproducir y ese dato es el que reemplaza a la etiqueta EMBED
width y height son el ancho y el alto del archivo (medido en pixeles) y son valores que podemos cambiar
En una etiqueta PARAM colocamos otra vez la URL del archivo a reproducir porque esa es la que leerá Internet Explorer.
Así que esto, mostraría un video de YouTube sin problemas; más corto, imposible:
<object width="425" height="350" type="application/x-shockwave-flash" data="http://www.youtube.com/v/jkTNe85y0UI"><param name="movie" value="http://www.youtube.com/v/jkTNe85y0UI" /></object>
Claro que hay más opciones, cada una de ellas se agrega en una etiqueta PARAM siempre con la misma sintaxis, colocando el nombre del atributo y su valor:
bgcolor establece el color de fondo (valor hexadecimal) si es que el SWF es transparente
wmode define al fondo como transparente (transparent) u opaco (opaque); también hay un valor extra llamado window
menu habilita (true) o deshabilita (false) el menú contextual sobre las películas
quality calidad de salida de la película (low, high, autolow, autohigh, best)
allowFullScreen habilita (true) o deshabilita (false) la posibilidad de ver a pantalla completa
Ejemplos:
<param name="bgcolor" value="#000000" />
<param name="wmode" value="transparent" />
<param name="menu" value="false" />
<param name="quality" value="high" />
<param name="allowFullScreen" value="false" />
La etiqueta OBJECT tiene otros atributos como ID, CLASS y ALIGN que son comunes a casi todas las etiquetas, y otros especiales:
classid identifica el control ActiveX y por lo tanto sólo se aplica a IE. Es un atributo innecesario, aún en Internet Explorer
codebase es la ubicación donde puede descargarse ese control ActiveX en caso que el navegador no disponga de él (en la etiqueta EMBED se usaba pluginspage)
Las etiquetas PARAM tienen opciones diversas (más información):
play indica si la película comienza a reproducirse de manera automática (true) o no (false)
loop indica si la película se repite de manera automática (true) o no (false)
scale especifica la forma en que se manejarán los tamaños (default, showall, noborder, exactfit)
base indica el directorio base para resolver paths relativos
flashvars contiene una serie de variables qie son pasadas al reproductor
Muchas veces, cuando el archivo de Flash contiene ciertas instrucciones, requiere que se le de permiso. Para eso, hay un parámetro específico llamado allowScriptAccess que, por defecto tiene un valor de sameDomain:
bgcolor establece el color de fondo (valor hexadecimal) si es que el SWF es transparente
wmode define al fondo como transparente (transparent) u opaco (opaque); también hay un valor extra llamado window
menu habilita (true) o deshabilita (false) el menú contextual sobre las películas
quality calidad de salida de la película (low, high, autolow, autohigh, best)
allowFullScreen habilita (true) o deshabilita (false) la posibilidad de ver a pantalla completa
Ejemplos:
<param name="bgcolor" value="#000000" />
<param name="wmode" value="transparent" />
<param name="menu" value="false" />
<param name="quality" value="high" />
<param name="allowFullScreen" value="false" />
La etiqueta OBJECT tiene otros atributos como ID, CLASS y ALIGN que son comunes a casi todas las etiquetas, y otros especiales:
classid identifica el control ActiveX y por lo tanto sólo se aplica a IE. Es un atributo innecesario, aún en Internet Explorer
codebase es la ubicación donde puede descargarse ese control ActiveX en caso que el navegador no disponga de él (en la etiqueta EMBED se usaba pluginspage)
Las etiquetas PARAM tienen opciones diversas (más información):
play indica si la película comienza a reproducirse de manera automática (true) o no (false)
loop indica si la película se repite de manera automática (true) o no (false)
scale especifica la forma en que se manejarán los tamaños (default, showall, noborder, exactfit)
base indica el directorio base para resolver paths relativos
flashvars contiene una serie de variables qie son pasadas al reproductor
Muchas veces, cuando el archivo de Flash contiene ciertas instrucciones, requiere que se le de permiso. Para eso, hay un parámetro específico llamado allowScriptAccess que, por defecto tiene un valor de sameDomain:
<param name="allowScriptAccess" value="sameDomain" />
Eso es lo que ocurre cuando se agregan menus realizados con Flash; no funcionan a menos que permitamos que se comuniquen. Los valores posibles son:
never impide el acceso a scripts de cualqueir tipo
always permite el acceso (es el valor por defecto en las viejas versiones)
sameDomain permite el acceso a scripts ubicados en el mismo dominio de la página
Así que en esos casos, debemos agregarle esto y todo funcionará:
never impide el acceso a scripts de cualqueir tipo
always permite el acceso (es el valor por defecto en las viejas versiones)
sameDomain permite el acceso a scripts ubicados en el mismo dominio de la página
Así que en esos casos, debemos agregarle esto y todo funcionará:
<param name="allowScriptAccess" value="always" />
31 comentarios:
hola amigo como van me gustaria que en tu pagina pudieras colocar cosas como scrips para tumblr bueno eso es todo
Como siempre maestro, genial..., nos tienes tan mal acostumbrados que el día que dejes de investigar y mostrarnos soluciones, mas de uno cae en la depresión :)
JMiur, este post me da pie para hacerle una pregunta sobre el código que da Magix para el reproductor de audio. Pero como el código es largo se lo mando por e-mail, ¿sí? Es algo medio raro porque incluye "span" y "script"...¿? :(
Saludos.
Hola JMiur, aqui vengo otra vez con algo "dificil" xD..
Queria saber si es posible aplicar este script en Blogger:
http://www.realtalkreggaeton.net/
Es el Script que utiliza en la Cabecera!
Listo, Gracias!
JMIUR admiro tu 'valentía' :) para tratar de entender los códigos, sos JM el destripado :P...mis besos!!!
kalilequi:
No sé a qué te refieres con eso. En Tumblr puede usarse código HTML igual que en cualquier web. Si te refieres al código de los temas, hay una pagina de ayuda donde se explican pero no he mirado mucho.
MicaDeTot:
Gracias por el comentario :$
Anahí:
Recibí tu mail, en un rato te contesto.
PedroX:
Técnicamente no debería haber problemas, cualquier script es compatible. En este caso, se trata de un script que, al parecer, debe ser "comprado".
Graciela:
Pués sí, destripado y desguasado :D
segun lo que veo es que object lo utiliza IE y embed firefox.
si no esta embed en el código demora en cargar la página abriendo con firefox si se ve pero demora la carga y si se hace solo con embed sin object no se ve en IE.
Gracias, JMiur, pero no sé si interpretó bien mi mensaje: "se ve" el embed. Ese es mi problem. :(
Saludos.
Sí y no :D Recién entendí lo del "detallecito" de ese código XD Ya te respondí en otro mail :D
Listo el pollo y pelada la gallina. :)
Perfecto :D
De dos páginas sacas tres líneas y sigue funcionado ¿por qué se empeñan en hacer las cosas complicadas?
Porque ... ¿por qué? Supongo que porque no les importa. eso sí, nos dan consejos que debemos seguir al pie de la letra :D
Buen post, pero hay un detalle: la etiqueta embed recientemente fue incluida como parte del estándar en HTML5, por lo que retirarla ya sólo es cuestión de, como en tu caso, comodidad; y no por la obligación de escribir todo correctamente.
La etiqueta EMBED en HTML5 está pensada para otro uso; video y audio utilizarían otras etiquetas pero, todo eso es un futuro bastante lejano. En este momento es innecesaria y no recomendada. Ningún estándard contempla que deban agregarse dos etiquetas diferentes para realizar la misma acción así que usar OBJECT + EMBED sigue siendo un error.
Hola Jmiur,mi comentario es más bien una pregunta relacionada con los archivos flash, aunque no con esta entrada, sino con una del 24 de mayo del 2007. Era la referida al coro de caballos cantores, que me gusta. He seguido tus indicaciones y sale la aplicacion perfectamente integrada dentro del blog. También sé poner una imagen de los caballos y enlazarla al archivo para que al pincharle se me descargue el flash y poder verlo en grande. Pero lo que me gustaría saber es cómo se hace para tener la imagen en el blog y que al pincharle me salga el archivo ya integrado en el blog, algo así como lo tienes tú.Gracias.
Para eso, uso un pequeño script. La forma de implementarlo está explicada en en esta entrada. Lo uso tanto para SWFs como para video de YouTube.
Muchisimas gracias JMiur por indicarme cómo se pone un archivo flash sin archivo flash(perdón por remedar tu título). He conseguido que funcione perfectamente. Si tu blog es tan grande es porque hay una gran persona que lo mantiene.
Saludos, Manuel, gracias por el comentario :$
Luego de recorrerme la web buscando información llegé a este blog que lo tiene todo, solo me falta tiempo para leerlo pero debo de felicitarte por exponer temas complejos de una manera sencilla, mis felicidades.
Ahora bien te hago una consulta, me gustaria poner una animación flash de fondo de un blog, intenté crear un código pero no funciona, en concreto es una animación sencilla de elementos, no lleva ni action scrip ni enlaces solo interpolaciones de movimiento o forma, probé con un gif y funciona pero no encuentro la solución para usar un flash, intentaré añadir parte del código que expones arriba a ver si ahi está la solución, por el momento esto es lo que uso.
style type="text/css">
/style>
muchas gracias un saludo
El código que quieres mostrar no se ve pero, si estás tratando de poner un archivo SWF en el CSS, no funcionará. Los archivos SWF se colocan directamente en la plantilla, con etiquetas HTML; van después de <body> y no antes.
Hola, los codigos ya me tienen loco,,,,ayuda al experto porfis. tengo un flash en el blog, que son fotos animadas.
El problema es que cada vez que pincho en el flash me redirecciona a la pagina de origen de creacion del flash; como puedo hacer para evitar este inconveniente?, habra alguna solucion???,,gracias
Los archivos de Flash son independientes, lo que hacen, depende de como fueron creados y no hay nada que podamos hacer para cambiarlo, salvo editar el SWF en si mismo.
ayuda porfis =/ yo quiero poner un flash tambien pero mi archivo es .js como le hago?
saludOs
disf:
Blogger fnciona como cualquier otro sitio weeb así que, supongo que es posible aunque no sé a que te refieres.
annyz:
Si es un script no es un archivo de Flash. Puede ser que el script lo cargue, no se cuál es el script al que haces referencia así que es imposible responder eso.
gracias me ayudo mucho tu articulo
Gracias JMiur, siempre es un gusto pasar por tu blog :)
Tengo una pregunta que código debo poner en la etiqueta OBJECT, para que el swf salga en la esquina superior izquierda?
Saludos.
Ninguno. por defecto, toda etiqueta se muestra en la esquina superior izquierda a menos que se indique lo contrario.
En wordpress hay muchas opciones de meter flash en los blogs gracias a sus gran cantidad de plugins.
Un ejemplo de flash en wordpress:
http://www.flashandmotion.com
No existen diferencias en el uso de Flash en los distintos CMSs; en cualquier página web se colocan igual; los plugins no son nada sofisticado, símplemente, escriben el código HTML del objeto.
Sabes, tengo una galería de fotos en flash con dimensiones aprox. de 500x290 px, la quiero insertar en una pagina web por intermedio de un enlace (texto o imagen), pero cuando la abre, lo hace en una pagina completa, no en el tamaño en la cual fue creada. Me gustaria que se abriera en su tamaño sin cerrar la pagina principal. Ojala me puedas ayudar.
Cristian
¿Quiere dejar un comentario?
recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...
Nota: sólo los miembros de este blog pueden publicar comentarios.
Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.
Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...