La etiqueta <object>
Las páginas Web, en su constante evolución. Han pasado de ser unos simples documentos, a verdaderas presentaciones multimedia, dotadas de imagenes, videos, sonidos, animaciones e incluso realidad virtual.Las características multimedia del HTML posibilitan a los programadores poner en sus páginas web, pequeña aplicaciones (programas que se descargan automáticamente y se ejecutan el ordenador del usuario), videos cortos como por ejemplo videoclips, trailers, últimamente está de moda los documentos flash y todo tipo de videos y/o animaciones.
Para normalizar la inclusión de ficheros, HTML 4 introduce la etiqueta OBJECT, que ofrece una solución universal para la inclusión de objetos genéricos. Object sustituye las etiquetas applet, bgsound, embed, etc. Siendo una etiqueta más moderna y flexible.
Sin embargo la polémica entre las diversos navegadores continúa. Mediante la etiqueta object definimos un objeto o un componente externo que tiene como misión la reproducion del fichero.
Normalmente, un navegador (Aunque sea capaz de reconocer la etiqueta OBJET) no podrá mostrar el contenido de un OBJECT a menos que tenga el correspondiente Plug-In instalado.
Insertando una imagen con la etiqueta <object>
Por ejemplo, si queremos adjuntar una imagen png en un documento, el programador puede escribir el siguiente código:
<object data="img/noche.png" type="image/png">
<em>Noche estrellada</em>
</object>
Nota: no funciona en el Enternet Explorer 6.0
se muestrará:
La sintaxis general de la etiqueta object, para el caso de ficheros de sonido:
<object atributo1="valor1" .... atributoN="valorN"> <param name="nombre" value="valor"> <param name="nombre" value="valor"> ... </object>
Atributos relativos al audio:
- classid="identificador_objeto". Fija la URL del objeto o componente externo necesario para reproducir el fichero de audio, y la implementación CLSID de los controles ActiveX necesarios.
- type="tipo_fichero". Indica el tipo de fichero de audio que ejecutoa.
- width="n". Fija la anchura en píxel de la consola.
- height="n". Fija la altura en píxels de la consola
- align="top / bottom / center / baseline / left / right / texttop /middle / absmiddle / absbotom". Similar la etiqueta img, indica la alineación vertical y/o de la consola.
- hspace="hs". Indica la separación horizontal en pixels entre la consola los elementos que la rodean,
- vspace="vs". Indica la separación vertical, en pixels, entre la consola y los elementos de la página que la rodean.
- autostart="true/false". Asigna si se comienza la reproducción del fichero automáticamente al cargarse la página o si se requiere la intervención del usuario para empezara la ejecución del archivo de audio.
- standby="mensaje". Muestra un mensaje en pantalla mientras se carga el fichero.
- param name="FileName" value="ruta_fichero". Indica el nombre del fichero y la ruta del fichero de audio a reproducir
- param name="autostart" value="true/false". Asigna si el navegador comenzara a reproducir sonido automáticamente al cargar la página o si será el usuario el que pulse el botón play .
<object data="t-rex.wav" type="sound/wav"
autostart="false" width="200" height="40">
(Sonido de un Tiranosaurio enfadado)
</object>
Este ejemplo no funciona en navegadores como Firefox pero si Explorer 6.0:
<object classid="CLSID:05589FA1-C356-11CE-BF01-00AA0055595A"
width="150" height="175" type="audio/mp3">
<param name="FileName" value="sounds/lack_of_faith.mp3">
<param name="autostart" value="false">
</object>
La sintaxis general de la etiqueta object, para los archivos de video, es:
<object atributo1="valor1" .... atributoN="valorN"> <param name="nombre" value="valor"> <param name="nombre" value="valor"> ... </object>
Atributos relativos al video:
- classid="identificador_objeto". Fija el identificador CLSID de los controles ActiveX necesarios.
- codebase="URL". Fija la URL del objeto o componente externo necesario para reproducir el fichero de video.
- type="tipo_fichero". Atributo importante, que declara el tipo de fichero de video que estamos usando.
- width="n". Determina el ancho visible de la consola de video, en pixels.
- height="n". Determina el alto visible de la consola de video, en pixels.
- align="top / bottom / center / baseline / left / right / texttop / middle / absmiddle / absbotom". Análogo al de la etiqueta IMG, define la alineación horizontal o vertical de la consola respecto de los elementos de la página.
- hspace="hs". Establece la separación horizontal, vspace="vs", que establece la separación vertical, en pixels, entre la consola y los elementos de la página que la rodean. Análoga a sus equivalentes de la etiqueta IMG.
- autostart="true/false". Determina si el fichero de video debe empezar a reproducirse por sí sólo al cargarse la página o si por el contrario será preciso la actuación del usuario (o de código de script) para que comience la reproducción.
- standby="mensaje". Presenta en pantalla un mensaje al usuario mientras el fichero se carga. En cuanto a los elementos param, los más importantes son:
- param name="filename" value="ruta_fichero". Establece la ruta del fichero de video, en forma relativa a la estructura de carpetas del sitio web o en forma de URL absoluta.
- param name="showcontrols" value="1/0". Fija si se debe de ver (valor por defecto) o no la barra inferior de controles de la consola de video. Sólo funciona bien en Internet Explorer.
- param name="showdisplay" value="1/0". Fija si se debe mostrar (valor por defecto) o no una banda inferior en la consola con información sobre el fichero de video (nombre, autor, copyright, etc.). Sólo funciona bien en Internet Explorer.
- param name="showstatusbar" value="1/0". Fija si se debe mostrar (valor por defecto) o no una banda inferior en la consola con información temporal sobre la visualización del video y sobre el sonido del mismo. Sólo funciona bien en Internet Explorer.
- param name="autosize" value="1/0". Fija si el tamaño de la consola se establece automáticamente o no. Sólo funciona bien en Internet Explorer.
- param name="autostart" value="true/false". Indica al navegador si se debe empezar a reproducir el video automáticamente al cargar la página o si por el contrario será preciso que el usuario pulse el botón Play para ello.
<object width="99" height="98"
classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
codebase="http://activex.microsoft.com/activex/
controls/mplayer/en/nsmp2inf.cab#Version=6,4,7,1112"
standby="Cargando fichero..."
type="application/x-oleobject">
<param name="filename" value="ejemplos/heart_1.avi">
<param name="showcontrols" value="0">
<param name="showdisplay" value="0">
<param name="showstatusbar" value="0">
<param name="autosize" value="0">
<param name="autostart" value="1">
</object>
Veamos como se inserta un objeto flash: (esto funciona solo en firefox y algunos navegadores, pero no en explorer)
<center>
<object data="img/lagarto.swf" width="200"
height="100" type="application/x-shockwave-flash">
un pequeño lagarto caminando
</object>
</center>
visualizacion:
<center>
<object data="img/lagarto.swf"
type="application/x-shockwave-flash"
width="200" height="100">
<param name="Movie" value="img/lagarto.swf"></param>
<param name="Play" value="True"></param>
<param name="Loop" value="True"></param>
<param name="Quality" value="Best"></param>
<param name="Scale" value="ShowAll"></param>
<param name="Align" value="Center"></param>
</object>
<center>
Pero en internet encontramos el siguiente código cuando queremos insertar un objeto flash:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/ cabs/flash/swflash.cab#version=6,0,29,0" width="522" height="259"> <param name="movie" value="image/lagarto.swf"> <param name="quality" value="high"> <embed src="intro.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="522" height="259"></embed> </object>