AdNow

loading...

Video HTML5

Video HTML5


Ejemplo de video HTML. Cortesía de Big Buck Bunny .

Pruebelo usted mismo »

Reproducción de videos en HTML

Antes de HTML5, un video solo podía reproducirse en un navegador con un complemento (como flash).
El elemento HTML5 <video> especifica una forma estándar de insertar un video en una página web.

Soporte del navegador

Los números en la tabla especifican la primera versión del navegador que admite completamente el elemento <video>.
Element
<video>4.09.03.54.010.5

El elemento HTML <video>

Para mostrar un video en HTML, use el elemento <video> :

Ejemplo

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Pruebelo usted mismo »


Cómo funciona

El atributo de controles agrega controles de video, como reproducción, pausa y volumen.
Es una buena idea incluir siempre atributos de ancho y alto . Si el alto y el ancho no están configurados, la página puede parpadear mientras se carga el video.
El elemento <origen> le permite especificar archivos de video alternativos de los cuales el navegador puede elegir. El navegador usará el primer formato reconocido.
El texto entre las etiquetas <video> y </ video> solo se mostrará en navegadores que no sean compatibles con el elemento <video>.

HTML <video> Reproducción automática

Para comenzar un video automáticamente use el atributo de reproducción automática :

Ejemplo

<video width="320" height="240" autoplay>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Pruebelo usted mismo »
El atributo de reproducción automática no funciona en dispositivos móviles como iPad y iPhone.

Video HTML - Soporte del navegador

En HTML5, hay 3 formatos de video admitidos: MP4, WebM y Ogg.
El soporte del navegador para los diferentes formatos es:
BrowserMP4WebMOgg
Internet ExplorerYESNONO
ChromeYESYESYES
FirefoxYESYESYES
SafariYESNONO
OperaYES (from Opera 25)YESYES

HTML Video - Media Types

File FormatMedia Type
MP4video/mp4
WebMvideo/webm
Oggvideo/ogg

Video HTML - Métodos, propiedades y eventos

HTML5 define los métodos DOM, las propiedades y los eventos para el elemento <video>.
Esto le permite cargar, reproducir y pausar videos, así como establecer la duración y el volumen.
También hay eventos DOM que pueden avisarle cuando un video comienza a reproducirse, está en pausa, etc.

Ejemplo: Usar JavaScript


   


Video cortesía de Big Buck Bunny .
Pruebelo usted mismo »
Para obtener una referencia completa de DOM, vaya a nuestra Referencia de DOM de audio / video HTML5 .

Etiquetas de video HTML5

TagDescription
<video>Defines a video or movie
<source>Defines multiple media resources for media elements, such as <video> and <audio>
<track>Defines text tracks in media players

Formulario de contacto

Nombre

Correo electrónico *

Mensaje *

Entradas más populares de este blog

Listado pasaporte y cedulas SAIME 2018

Etiqueta HTML < abbr >

HTML < a > tag

Visitas a este blog