video

El elemento video se utiliza para incrustar vídeos en un documento HTML o XHTML.

Para obtener una lista de formatos compatibles, consulta Formatos multimedia admitidos por los elementos de audio y vídeo .

Contexto de uso

Contenido permitido Contenido transparente , que contiene un atributo src o uno o m√°s elementos <source>, seguidos por contenido din√°mico o el contenido est√°tico , sin elementos  <video> ni  <audio>.
Omisión de etiquetas Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre
Elementos primarios permitidos Cualquier elemento que acepte contenido din√°mico o cualquier otro elemento que acepte contenido est√°tico .
Documento normativo HTML 5, sección 4.8.6

Atributos

autoplay
Un atributo booleano; si se especifica, el video comenzar√° a reproducirse autom√°ticamente tan pronto como sea posible, sin detenerse para terminar de cargar los datos.
autobuffer
Un atributo booleano; si se especifica, el video comenzar√° autom√°ticamente a almacenarse en el b√ļfer, incluso si no est√° listo para reproducirse de forma autom√°tica. Esto se debe utilizar para los casos en los que se considera probable que el video se reproduzca (por ejemplo, si el usuario accedi√≥ a esa p√°gina espec√≠fica para reproducir el video, no si hay un video insertado junto con otros contenidos). El video se almacena en el b√ļfer hasta que el cach√© de medios est√© lleno.
Nota de implementaci√≥n: aunque forma parte de los primeros borradores de la especificaci√≥n HTML 5, el atributo autobuffer se ha eliminado en versiones posteriores. Se ha quitado de Gecko 2.0 y otros navegadores, y en algunos nunca lleg√≥ a implementarse. La especificaci√≥n define un nuevo atributo enumerado, preload, para sustituir el atributo autobuffer, con una sintaxis diferente. error 548523
buffered
Un atributo que se puede leer para determinar qu√© intervalos de tiempo del multimedia se han almacenado en b√ļfer. Este atributo contiene un objeto TimeRanges .
controls
Si est√° presente este atributo, Gecko ofrecer√° controles para permitir que el usuario controle la reproducci√≥n de video, incluyendo volumen, b√ļsqueda y pausar/reanudar reproducci√≥n.
height
La altura del área de visualización del vídeo en píxeles CSS.
loop
Un atributo booleano; si se especifica, al alcanzar el final del video, buscaremos autom√°ticamente hasta el principio.
preload error 548523
El objetivo de este atributo enumerado es proporcionar una sugerencia al navegador sobre qué cree el autor que llevará a la mejor experiencia para el usuario . Puede tener uno de los siguientes valores:
  • none: sugiere bien que el autor cree que el usuario no tendr√° que consultar ese video, bien que el servidor desea minimizar su tr√°fico; es decir, esta sugerencia indica que no se debe almacenar en cach√© este video.
  • metadatos: sugiere que aunque el autor piensa que el usuario no tendr√° que consultar este video, es razonable capturar los metadatos (p. ej. longitud).
  • auto: sugiere que el usuario necesita tener prioridad; es decir, esta sugerencia indica que, si es necesario, se puede descargar el video completo, incluso aunque el usuario no vaya a usarlo.
  • la cadena vac√≠a: que es un sin√≥nimo del valor auto.

Si no está configurado, su valor predeterminado está definido por el navegador (es decir, cada navegador puede elegir su propio valor predeterminado), aunque la especificación aconseje que se establezca a metadata.

Notas de uso:
  • El atributo autoplay  tiene prioridad sobre √©ste si se desea reproducir autom√°ticamente un video, el navegador obviamente tendr√° que descargarlo. La especificaci√≥n permite establecer los atributos autoplay y preload.
  • La especificaci√≥n no fuerza al navegador a seguir el valor de este atributo; es tan s√≥lo una sugerencia.
poster
Una URL que indica un marco de póster para mostrar el resultado hasta que el usuario reproduzca o busque. Si este atributo no se especifica, no se muestra nada hasta que el primer cuadro está disponible, entonces se muestra el primer marco como el marco de póster.
src
La URL del vídeo que se va a insertar. Es opcional; podrás optar, en su lugar, por el elemento <source> dentro del bloque de vídeo para especificar el video que se va a incrustar.
width
La anchura del área de visualización del vídeo en píxeles CSS.

Las compensaciones de tiempo se especifican actualmente como valores float que representan el n√ļmero de segundos que se va a compensar.

Nota: la definici√≥n del valor de compensaci√≥n de tiempo no se ha completado en HTML 5 a√ļn y est√° sujeta a cambios.

Ejemplos

<video src="videofile.ogg" autoplay poster="posterimage.jpg">
  Tu navegador no admite el elemento <code>video</code>.
</video>

Reproduce un vídeo, comenzando tan pronto como la recepción de video sea suficiente para permitir la reproducción sin pausas para descargar más. Mientras que el video comienza a reproducirse, se mostrará la imagen "posterimage.jpg" en su lugar.

Compatibilidad con servidores

Vale la pena volver a hacer hincapié, por el momento, en que si los tipos MIME para vídeo Theora no se establecen en el servidor, tal vez el vídeo no se muestre o muestre un cuadro gris con una X (si JavaScript está activado).

Puedes solucionar este problema para el servidor Web Apache a√Īadiendo la extensi√≥n utilizada por tus archivos de v√≠deo Theora (".ogm", ".ogv", o ".ogg" son los m√°s comunes) al tipo MIME "video / ogg" a trav√©s del archivo "mime.types" en "/ etc / apache" o por medio de la directiva de configuraci√≥n "AddType" en httpd.conf.

AddType video/ogg .ogm
AddType video/ogg .ogv
AddType video/ogg .ogg

Su proveedor de alojamiento web puede proporcionar una interfaz fácil para los cambios de configuración de tipo MIME que presentan las nuevas tecnologías hasta que tenga lugar una actualización global de forma natural.

Interfaz DOM

Consulta también