20
La etiqueta <MARQUEE> </MARQUEE> crea una marquesina cuyo contenido se desplaza. Por defecto, ocupa todo el ancho de la pantalla, tiene una línea de altura y el texto se mueve lentamente de derecha a izquierda. Los atributos WIDHT y HEIGHT permiten controlar el ancho y el alto de la marquesina y pueden expresarse en pixeles o porcentualmente. El atributo ALIGN permite alinear el texto que rodea la marquesina, y puede tener los siguientes valores: top (arriba), middle (centrado) bottom (abajo). Los atributos HSPACE y VSPACE definen la separación horizontal y vertical del texto con los bordes de la marquesina: <marquee width="50%" height="60" align="bottom"> ... texto ... </marquee> El color de fondo puede establecerse con el atributo BGCOLOR o, utilizando el atributo STYLE, podemos establecer cualquier propiedad, de manera similar al resto de las etiquetas HTML: <marquee style="...propiedades..."> ... texto ... </marquee> Para controlar más efectivamente las marquesinas, existen una serie de atributos especiales: DIRECTION se utiliza para modificar la dirección hacia la que se dirige el texto. Puede ser left (el valor por defecto), right, up o down: <marquee direction="right"> ... texto ... </marquee> Con el atributo SCROLLDELAY se define el tiempo entre cada movimiento expresado en milisegundos: <marquee scrolldelay="300"> ... texto ... </marquee> LOOP indica el número de veces que aparecerá el texto y por defecto, es infinito.

La Etiquetaejemplos Pagina Web

Embed Size (px)

Citation preview

Page 1: La Etiquetaejemplos Pagina Web

La etiqueta <MARQUEE> </MARQUEE> crea una marquesina cuyo contenido se desplaza. Por defecto, ocupa todo el ancho de la pantalla, tiene una línea de altura y el texto se mueve lentamente de derecha a izquierda.

Los atributos WIDHT y HEIGHT permiten controlar el ancho y el alto de la marquesina y pueden expresarse en pixeles o porcentualmente. El atributo ALIGN permite alinear el texto que rodea la marquesina, y puede tener los siguientes valores: top (arriba), middle (centrado) bottom (abajo). Los atributos HSPACE y VSPACE definen la separación horizontal y vertical del texto con los bordes de la marquesina:<marquee width="50%" height="60" align="bottom">... texto ...</marquee>

El color de fondo puede establecerse con el atributo BGCOLOR o, utilizando el atributo STYLE, podemos establecer cualquier propiedad, de manera similar al resto de las etiquetas HTML:

<marquee style="...propiedades...">... texto ...</marquee>

Para controlar más efectivamente las marquesinas, existen una serie de atributos especiales:

DIRECTION se utiliza para modificar la dirección hacia la que se dirige el texto. Puede ser left (el valor por defecto), right, up o down:<marquee direction="right"> ... texto ...</marquee>

Con el atributo SCROLLDELAY se define el tiempo entre cada movimiento expresado en milisegundos:<marquee scrolldelay="300"> ... texto ...</marquee>

LOOP indica el número de veces que aparecerá el texto y por defecto, es infinito.

Con SCROLLAMOUNT controlamos la cantidad de desplazamiento del texto en cada movimiento de avance. Cuanto mayor es el número, más rápido avanza::::::…:Por último, el atributo BEHAVIOR (comportamiento) sirve para definir de que manera se va a efectuar el desplazamiento y puede tener los siguientes valores:

scroll (valor por defecto), aparece por un lado, se desplaza hasta el otro, desaparece y vuelve a empezar

slide aparece por un lado, se desplaza y se detiene (sólo funciona en Internet Explorer).

alternate se desplaza alternativamente hacia un lado y el otro.

Por último, el atributo BEHAVIOR (comportamiento) sirve para definir de que manera se va a efectuar el desplazamiento y puede tener los siguientes valores:

Page 2: La Etiquetaejemplos Pagina Web

scroll (valor por defecto), aparece por un lado, se desplaza hasta el otro, desaparece y vuelve a empezar

slide aparece por un lado, se desplaza y se detiene (sólo funciona en Internet Explorer).

alternate se desplaza alternativamente hacia un lado y el otro. Las marquesinas no sólo pueden contener textos, también pueden contener otros

elementos, por ejemplo, imágenes, vínculos o tablas:

Podemos controlar una marquesina mientras se ejecuta? Aquí hay un ejemplo simple, mediante dos pseudo-botones, logramos cambiarle la dirección:

<marquee id="ejemplo" direction="up"> ... contenido ...</marquee>

<a href="javascript:void(0);" onclick="getElementById('ejemplo').direction='down';"> Hacia abajo</a><a href="javascript:void(0);" onclick="getElementById('ejemplo').direction='up';"> Hacia arriba</a>

Dddddddddddddddddddddddddddddddddddddd

Introducción a los formularios

Un formulario HTML es una sección de un documento que contiene contenido normal, código, elementos especiales llamados controles (casillas de verificación (checkboxes), radiobotones (radio buttons), menúes, etc.), y rótulos (labels) en esos controles. Los usuarios normalmente "completan" un formulario modificando sus controles (introduciendo texto, seleccionando objetos de un menú, etc.), antes de enviar el formulario a un agente para que lo procese (p.ej., a un servidor web, a un servidor de correo, etc.)

Aquí se muestra un ejemplo de un formulario simple que incluye rótulos, radiobotones y botones para reinicializar el formulario o para enviarlo:

<FORM action="http://algunsitio.com/prog/usuarionuevo" method="post"> <P> <LABEL for="nombre">Nombre: </LABEL> <INPUT type="text" id="nombre"><BR> <LABEL for="apellido">Apellido: </LABEL> <INPUT type="text" id="apellido"><BR> <LABEL for="email">email: </LABEL> <INPUT type="text" id="email"><BR> <INPUT type="radio" name="sexo" value="Varón"> Varón<BR> <INPUT type="radio" name="sexo" value="Mujer"> Mujer<BR> <INPUT type="submit" value="Enviar"> <INPUT type="reset"> </P> </FORM>

Page 3: La Etiquetaejemplos Pagina Web

Nota. Esta especificación incluye información más detallada sobre formularios en las subsecciones sobre representación de formularios.

17.2 Controles

Los usuarios interaccionan con los formularios a través de los llamados controles.

El "nombre de control" de un control viene dado por su atributo name. El "campo de acción" o alcance del atributo name de un control contenido en un elemento FORM es el elemento FORM.

Cada control tiene tanto un valor inicial como un valor actual, que son ambos cadenas de caracteres. Consulte la definición de cada control para obtener información sobre los valores iniciales y las posibles restricciones que puede imponer cada control sobre sus valores. En general, el "valor inicial" de un control puede especificarse con el atributo value del elemento de control. Sin embargo, el valor inicial de un elemento TEXTAREA viene dado por sus contenidos, y el valor inicial de un elemento OBJECT de un formulario está determinado por la implementación del objeto (es decir, se sale fuera del alcance de esta especificación).

El "valor actual" del control se hace en primer lugar igual al valor inicial. A partir de ese momento, el valor actual del control puede ser modificado a través de la interacción con el usuario y mediante scripts.

El valor inicial de un control no cambia. Así, cuando se reinicializa el formulario, el valor actual de cada control se reinicializa a su valor inicial. Si el control no tiene un valor inicial, el efecto de una reinicialización del formulario sobre ese control es indefinido.

Cuando se envía un formulario para su procesamiento, para algunos controles se empareja su nombre con su valor actual, y estas parejas se envían con el formulario. Aquellos controles cuyas parejas nombre/valor se envían se llaman controles con éxito.

17.2.1 Tipos de controles

HTML define los siguientes tipos de controles:

botonesLos autores pueden crear tres tipos de botones:

botones de envío (submit buttons): Cuando se activa, un botón de envío envía un formulario. Un formulario puede contener más de un botón de envío.

botones de reinicialización (reset buttons): Cuando se activa, un botón de reinicialización reinicializa todos los controles a sus valores iniciales.

Page 4: La Etiquetaejemplos Pagina Web

botones pulsadores (push buttons): Los botones pulsadores no tienen un comportamiento por defecto. Cada botón pulsador puede tener asociados scripts en el lado del cliente a través del atributo event del elemento. Cuando ocurre un evento (p.ej., el usuario aprieta el botón, lo suelta, etc.), se acciona el script asociado.

Los autores deberían especificar el lenguaje de programación del script de un botón pulsador a través de una declaración de scripts por defecto (con el elemento META).

Los autores crean botones con el elemento BUTTON o el elemento INPUT. Consulte las definiciones de estos elementos para más detalles sobre cómo especificar diferentes tipos de botones.

Nota. Los autores deberían observar que el elemento BUTTON ofrece posibilidades más ricas de representación que el elemento INPUT.

casillas de verificación (checkboxes)Las casillas de verificación (y los radiobotones) son interruptores de encendido/apagado que pueden ser conmutados por el usuario. Una casilla de verificación está "marcada" cuando se establece el atributo checked del elemento de control. Cuando se envía un formulario, solamente pueden tener éxito los controles de casillas de verificación que estén marcadas.

Varias casillas de verificación de un formulario pueden compartir el mismo nombre de control. Así, por ejemplo, las casillas de verificación permiten a los usuarios elegir varios valores para la misma propiedad. Para crear un control de casilla de verificación se utiliza el elemento INPUT .

radiobotones (radio buttons)Los radiobotones son como las casillas de verificación, excepto en que cuando varios comparten el mismo nombre de control, son mutuamente exclusivos: cuando uno está "encendido", todos los demás con el mismo nombre se "apagan". Para crear un control de radiobotón se usa el elemento INPUT.Si ninguno de los radiobotones de un conjunto que comparten el mismo nombre tiene un valor inicial de "encendido", el comportamiento del agente de usuario al elegir cuál es el control que está inicialmente "encendido" queda sin definir. Nota. Debido a que las implementaciones existentes tratan este caso de formas diferentes, la especificación actual difiere de RFC 1866 ([RFC1866] sección 8.1.2.4), que dice: En cualquier momento, exactamente uno de los radiobotones de un conjunto está marcado. Si ninguno de los elementos <INPUT> de un conjunto de radiobotones especifica 'CHECKED', entonces el agente de usuario debe marcar el primer radiobotón del conjunto inicialmente.

Page 5: La Etiquetaejemplos Pagina Web

Al diferir los comportamientos de los agentes de usuario, los autores deberían asegurarse de que en cada conjunto de radiobotones hay uno que inicialmente está "encendido".

menúes (menus)Los menúes ofrecen al usuario opciones entre las cuales elegir. El elemento SELECT crea un menú, en combinación con los elementos OPTGROUP y OPTION.

entrada de texto (text input)Los autores pueden crear dos tipos de controles que permiten a los usuarios introducir textos. El elemento INPUT crea un control de entrada de una sola línea, y el elemento TEXTAREA crea una control de entrada de varias líneas. En ambos casos, el texto introducido se convierte en el valor actual del control.

selección de ficheros (file select)Este tipo de control permite al usuario elegir ficheros de modo que sus contenidos puedan ser enviados con un formulario. Se usa el elemento INPUT para crear un control de selección de ficheros.

controles ocultos (hidden controls)Los autores pueden crear controles que no se muestran pero cuyos valores se envían con un formulario. Los autores usan normalmente este tipo de controles para almacenar información entre intercambios cliente/servidor que de otro modo se perdería debido a la naturaleza no persistente del protocolo HTTP (ver [RFC2616]). Para crear un control oculto se usa el elemento INPUT.

controles tipo objeto (object controls)Los autores pueden insertar objetos genéricos en los formularios de modo que los valores asociados se envíen junto con los demás controles. Los autores crean controles tipo objeto con el elemento OBJECT.

Los elementos utilizados para crear controles aparecen normalmente dentro de un elemento FORM, pero también pueden aparecer fuera de la declaración de un elemento FORM cuando se utilizan para construir interfaces de usuario. Sobre esto se habla en la sección sobre eventos intrínsecos. Obsérvese que los controles que estén fuera de un formulario no pueden ser controles con éxito.

17.3 El elemento FORM

<!ELEMENT FORM - - (%block;|SCRIPT)+ -(FORM) -- formulario interactivo --><!ATTLIST FORM %attrs; -- %coreattrs, %i18n, %events -- action %URI; #REQUIRED -- procesador del formulario en el servidor -- method (GET|POST) GET -- método HTTP usado para enviar formulario -- enctype %ContentType; "application/x-www-form-urlencoded" accept %ContentTypes; #IMPLIED -- lista de tipos MIME para subir ficheros -- name CDATA #IMPLIED -- nombre del formulario para los scripts --

Page 6: La Etiquetaejemplos Pagina Web

onsubmit %Script; #IMPLIED -- el formulario fue enviado -- onreset %Script; #IMPLIED -- el formulario fue reinicializado -- accept-charset %Charsets; #IMPLIED -- lista de codif. de caracteres soportadas -- >

Etiqueta inicial: obligatoria, Etiqueta final: obligatoria

Definiciones de atributos

action = uri [CT]Este atributo especifica un agente procesador de formularios. El comportamiento del agente de usuario frente a un valor diferente de un URI HTTP es indefinido.

method = get|post [CI]Este atributo especifica qué método HTTP se usará para enviar el conjunto de datos del formulario. Los valores posibles (que no distinguen entre mayúsculas y minúsculas) son "get" (valor por defecto) y "post". Véase la sección sobre envío de formularios para información sobre su uso.

enctype = tipo de contenido [CI]Este atributo especifica el tipo de contenido usado para enviar el formulario al servidor (cuando el valor del atributo method sea "post"). El valor por defecto de este atributo es "application/x-www-form-urlencoded". El valor "multipart/form-data" debería usarse en combinación con el elemento INPUT, type="file".

accept-charset = lista de codificaciones de caracteres [CI]Este atributo especifica la lista de codificaciones de caracteres para los datos introducidos que son aceptadas por el servidor que procesa este formulario. El valor es una lista de valores de codificaciones de caracteres separadas por espacios y/o comas. El cliente debe interpretar esta lista como una lista o-exclusiva, es decir, el servidor es capaz de aceptar cualquier codificación de caracteres individual por entidad recibida.

El valor por defecto de este atributo es la cadena reservada "UNKNOWN" ("desconocido"). Los agentes de usuario pueden interpretar este valor como la codificación de caracteres que fue usada para transmitir el documento que contiene este elemento FORM.

accept = lista de tipos de contenido [CI]Este atributo especifica una lista de tipos de contenido separados por comas que un servidor procesador de formularios manejará correctamente. Los agentes de usuario pueden utilizar esta información para filtrar ficheros no conformes cuando pidan al usuario seleccionar ficheros para enviar al servidor (véase el elemento INPUT cuando type="file").

name = cdata [CI]Este atributo da nombre al elemento de modo que se pueda hacer referencia a él desde hojas de estilo o scripts. Nota. Este atributo ha sido incluido por motivos de

Page 7: La Etiquetaejemplos Pagina Web

compatibilidad con versiones anteriores. Las aplicaciones deberían usar el atributo id para identificar elementos.

form action="mailto:[email protected]" method="post" enctype="text/plain">Nombre: <input type="text" name="nombre" size="25" maxlength="50"><br><br>Apellidos: <input type="text" name="apellidos" size="35" maxlength="100"><br><br>Correo electrónico: <input type="text" value="@" name="correo" size="40" maxlength="100"><br><br>Población: <input type="text" name="poblacion" size="15" maxlength="50"><br><br>Provincia: <input type="text" name="provincia" size="15" maxlength="50"><table width="100%" border="0" cellspacing="0" cellpadding="10"><tr><td>Edad:<br><input type="radio" name="edad" value="020"> 0-20<br><input type="radio" name="edad" value="2040" checked> 20-40<br><input type="radio" name="edad" value="4060"> 40-60<br><input type="radio" name="edad" value="60100"> 60-100</td><td>&iquest;C&oacute;mo nos conociste?<br><input type="checkbox" name="conocer">A trav&eacute;s de un amigo.<br><input type="checkbox" name="conocer">A trav&eacute;s de un buscador.<br><input type="checkbox" name="conocer">Navegando por la red.<br><input type="checkbox" name="conocer">Otros</td></tr></table>Opinión sobre nuestra p&aacute;gina web<br><textarea cols="40" rows="5" name="opinion">Escriba aquí su opinión...</textarea><br><br>Tiene alguna sugerencia...<br><textarea cols="40" rows="5" name="sugerencias">Escriba aquí sus sugerencias...</textarea><br><br>&iquest;C&uacute;anto navegas por intenet? (Se&ntilde;ala la opci&oacute;n que m&aacute;s se acerque)<br><select name="frecuencia" size="2"><option value="1">2 horas al día.<option value="2">4 horas al día.<option value="3">10 horas a la semana.

Page 8: La Etiquetaejemplos Pagina Web

<option value="4">20 horas al mes.</select><br><br><table width="50%" border="0" align="center" cellpadding="10" cellspacing="0"><tr><td><div align="center"><input type="submit" value="Enviar formulario"></div></td><td><div align="center"><input type="Reset" value="Borrar formulario"></div></td></tr></table></form>

llllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllll

Hacer el código de nuestro Applet

En primer lugar, tenemos que hacer una clase Java que herede de JApplet. Esta clase será la que tenga nuestro código en java. Tenemos dos posibles métodos que podemos sobreescribir de la clase padre: el método init() y el método start(). Al primero se le llamará una única vez cuando nuestro applet se cargue en el navegador para ejecutarse. Al método start() se le llamará cada vez que se revisite con el navegador la página que tiene nuestro Applet. A nosotros, de momento, nos bastará con el métod init() del Applet.

Puesto que un JApplet es un JComponent más de java, podemos usarlo para añadir en él los componentes gráficos de nuestra ventana: JLabel, JButton, JTextField, etc. Nosotros, como es un ejemplo simple, añadiremos nada más un JLabel con el texto "Applet hola mundo".

El código de nuestro Applet puede quedar así

package com.chuidiang.ejemplos.applet;

import javax.swing.JApplet;import javax.swing.JLabel;

/** * Ejemplo sencillo de applet * @author Chuidiang * */public class EjemploApplet extends JApplet {

/** * Pone un JLabel con el texto "Applet hola mundo" en el JApplet,

de * forma que es lo que se visualizará en el navegador. */

Page 9: La Etiquetaejemplos Pagina Web

public void init() {JLabel etiqueta = new JLabel("Applet hola mundo");add(etiqueta);

}}

El programa, por supuesto, debemos compilarlo y generar el .class

Hacer la página de nuestro Applet

Como hemos comentado, el Applet debe ser referenciado por una página html, que es la que se visualizará en el navegador. Así que nos hacemos una página html. Para referencia el Applet, usamos el tag html <applet>. En este tag debemos indicar como mínimo el nombre de nuestra clase y el ancho y alto con el que queremos que se visualice nuestro Applet. La página html puede quedar como esta

<html> <head> <title>Ejemplo de Applet</title> </head> <body> <applet code="com.chuidiang.ejemplos.applet.EjemploApplet" width="500" height="200"> Debes tener instalado java </applet> </body></html>

Situación de la página html y del .class

Para que el navegador sea capaz de encontrar el .class del Applet a partir de la página html, debemos colocarlos juntos, en el mismo directorio. Sin embargo, tal cual indica java y al tener nuestro Applet un package en el código, debemos hacer una estructura de directorios similar a la del package y meter el .class dentro. De esta forma, la página html y el .class del Applet deberían estar ubicados así

+-- ejemplo-applet.html+-- com +-- chuidiang +--- ejemplos +---- applet +---- EjemploApplet.class

es decir, el directorio com en paralelo con el fichero ejemplo-applet.html y debajo de com toda la estructura chuidiang/ejemplos/applet/EjemploApplet.class

Page 10: La Etiquetaejemplos Pagina Web

En el tag <applet> de la página html hemos puesto en el atributo code el nombre de nuestra clase, con todos sus package delante.

Listo. Visualizando en el navegador la página ejemplo-applet.html, deberíamos ver el applet funcionando.

El Applet y los jar

Si nuestro Applet es más complejo y requiere varias clases, lo normal es que hagamos un jar con todas esas clases. También es posible, si nuestro Applet es lo suficientemente complejo, que incluso necesitemos otros jar de herramientas de terceros que usemos.

Para indicar al navegador que debe cargar todos estos jar, tanto el nuestro como los de los demás, existe el atributo archive del tag <applet>. En este archive podemos poner todos los jar que necesitemos separados por comas.

<applet code="com.chuidiang.ejemplo.applet.EjemploApplet" archive="un.jar, otro.jar, mas.jar" ...

Eso sí, todos estos jar deben estar subidos junto a nuestra página html.

Restricciones en los Applet

Un Applet es un programa que se ejecuta en el navegador del usuario que visita la página web, es decir, se ejecuta en SU ordenador. Por ello, sería mala idea dejar que un Applet pudiera hacer cualquier cosa. Yo podría hacer un Applet que borrara el disco duro y símplemente visitando la página donde yo lo ponga, se borraría el disco duro del visitante.

Por ello, el navegador restringe severamente las cosas que un Applet puede hacer. Un Applet no puede acceder a NINGÚN recurso del ordenador donde se está ejecutando. No puede leer ni escribir en el disco duro, manejar la impresora, etc, etc, etc. Tampoco puede establecer conexiones de ningún tipo con otros ordenadores, con la única excepción del servidor web donde se alberga el Applet.

Si quieres que un Applet pueda hacer más cosas, hay que firmarlo digitalmente. Al hacer esto, cuando se visualize el Applet en el navegador, este sacará un aviso al usuario, indicando que el Applet está firmado digitalmente por tal persona o entidad, y le pregunta al usuario si confía en dicha persona o entidad. Si el usuario dice que confía, el Applet tendrá entonces los permisos para hacer lo que necesite. Si el usuario no confía, el Applet sigue igual de restringido que antes.

Page 11: La Etiquetaejemplos Pagina Web

Acceso a recursos

Como hemos comentado, el Applet sólo puede acceder a recursos que estén en el servidor web donde está alojado. Sin embargo, tampoco puede acceder a esos ficheros, iconos o lo que sea como si fueran ficheros normales, puesto que el disco duro del servidor no está directamente accesible. Cualquier acceso del Applet debe hacerse a través del servidor web, usando el protocolo http.

Para facilitar este acceso, la clase JApplet tiene métodos que nos facilitan estos accesos al servidor web a través de http. Algunos de estos métodos son play() y getAudioClip() para acceso a ficheros de sonido, getImage() para acceso a imágenes, etc.

Al ser a través de servidor web, NO podemos escribir en el servidor. Así que no podemos abrir un fichero del servidor y escribir en él.

En cuanto a conexiones a base de datos, podemos acceder a una base de datos que esté alojada en el mismo servidor web que nuestro Applet, pero NO podemos abrir conexiones con ningún otro sitio.

Ejemplo de applet

El código que aparece a continuación muestra la implementación en Java del programa que muestra en la ventana principal del navegador la frase ``Hola Mundo en Java":

/** * Applet Hello World */ import java.applet.Applet; import java.awt.Graphics;

public class AppletSimple extends Applet{ public void paint(Graphics g){ g.drawString("Hola Mundo en Java", 50, 25); } }

El primer paso para manipular un applet Java es compilarlo ejecutando en la línea de comandos la instrucción

>javac AppletSimple.java

Al realizar este paso se obtiene una fichero AppletSimple.class.

Page 12: La Etiquetaejemplos Pagina Web

El fichero .class resultante de la compilación, se ha de incrustar en un fichero para ser ejecutado por un navegador.

En este caso las etiquetas a utilizar son <APPLET> y </APPLET>.

El siguiente código HTML contine la estructura de la etiqueta para el ejemplo que nos ocupa (está almacenado en un fichero con nombre html.html).

<html><head><title> Un applet simple </title></head><body><p>A continuación está la salida del programa</p><applet code="AppletSimple.class" width="300" height="100">No hay disponible un intérprete de Java</applet></body></html>

Llllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllll

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.

Page 13: La Etiquetaejemplos Pagina Web

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.

Parámetros relativos al sonido:

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 .

Page 14: La Etiquetaejemplos Pagina Web

Cabe mencionar que estos no son todos los atributos y parámetros que existen para esta etiqueta. Se pueden encontrar mas atributos y parámetros tanto en paginas oficiales, así como en otros manuales. Este ejemplo funciona en navegadores como Firefox pero on Explorer 6.0: <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>

Kkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk

Video

<embed src="direccioon video"loop=infinite width=500 height=500>

Vemos cómo añadir un video a nuestra página web mediante HTML 5.Por Justin Whitney¿Y cómo se inserta un video dentro de una página web con la sintaxis de HTML5? Muy fácil:

<video id="sampleMovie" src="HTML5Sample.mov" controls></video>

¡Y ya está! Esto es todo cuanto necesitamos para incorporar un reproductor de vídeo a nuestro sitio web sin tener que acudir a complementos de otros fabricantes o añadir código de otros sitios: basta con una sencilla etiqueta.

¡Ojalá fuera todo así de simple!

La complejidad de HTML5 viene no de su sintaxis, sino del soporte que ofrezca el propio navegador y la codificación del vídeo. Los desarrolladores hasta ahora se las han visto

Page 15: La Etiquetaejemplos Pagina Web

negras para resolver los problemas de compatibilidad entre los diferentes navegadores, pero es que además existen discrepancias mucho más amplias de lo normal entre los distintos fabricantes de navegadores al respecto de los estándares de codificación (los "codecs") de vídeo. Para poder hacer un sitio HTML5 que funcione bien necesitaremos tener en cuenta la forma en que implementan los navegadores actuales, como Chrome 4, Firefox 4 e Internet Explorer 9 los estándares de vídeo para la web y también tendremos que resolver el problema de la reproducción en los navegadores antiguos.