El mejor tutorial de HTML5 Vídeo (Video) en 2024. En este tutorial podrás aprender Detectar el navegador es compatible con vídeo HTML5:,El sitio Web de vídeo,Soporte para el navegador,HTML5 (vídeo) - ¿Cómo funciona?,Ejemplos,Formatos de vídeo y soporte de los navegadores,Formato de vídeo,HTML5 <video> - para controlar el uso de DOM,Ejemplo 1,etiqueta de vídeo HTML5,
Muchos sitios utilizarán para el vídeo. HTML5 ofrece una pantalla de vídeo estándar.
Hasta ahora, todavía no existe una norma dirigida a la pantalla de vídeo en la página.
Hoy en día, la mayoría de vídeo a través de los plug-ins (como Flash) que se mostrará. Sin embargo, no todos los navegadores tienen los mismos plugins.
HTML5 especifica una forma estándar para incluir el vídeo a través de los elementos de vídeo.
Internet Explorer 9 o superior, Firefox, Opera, Chrome, Safari y apoyo elemento <video>.
Nota: Internet Explorer 8 o versiones anteriores de IE no son compatibles con el elemento <video>.
Para mostrar el vídeo en HTML5, todo lo que necesita es:
<Video> elemento proporciona la reproducción, pausa y el volumen de control para mantener el video.
Al mismo tiempo elemento <video> elemento también proporciona atributos height y width controlar las dimensiones del vídeo. Si ajusta la altura y la anchura del espacio de vídeo requerida será retenido cuando se carga la página. . Si no establece estas propiedades, el navegador no conoce el tamaño del vídeo, el navegador no puede reservar un espacio específico cuando está cargado, la página se basa en el cambio de tamaño de vídeo originales.
<Video> entre la etiqueta </ video> y el contenido insertado no está disponible para apoyar los elementos de vídeo se muestran en el navegador.
<Video> elemento es compatible con múltiples <fuente> elemento. <Fuente> elementos pueden enlazar a diferentes archivos de vídeo. El navegador usará el primer formato reconocido:
Actual, elemento <video> soporta tres formatos de vídeo: MP4, WebM, Ogg y:
navegador | MP4 | WebM | Ogg |
---|---|---|---|
Internet Explorer | SÍ | NO | NO |
cromo | SÍ | SÍ | SÍ |
Firefox | SÍ | SÍ | SÍ |
safari | SÍ | NO | NO |
ópera | Sí (Opera desde 25 en adelante) | SÍ | SÍ |
格式 | MIME-type |
---|---|
MP4 | video/mp4 |
WebM | video/webm |
Ogg | video/ogg |
HTML5 <video> y <audio> elemento también tiene métodos, propiedades y eventos.
Métodos <video> y <audio>, propiedades y eventos pueden ser controlados usando JavaScript.
¿Qué métodos se utilizan para reproducir, pausar, y la carga y así sucesivamente. En el que las propiedades (tales como la duración, volumen, etc.) pueden ser leídos o no definida. En donde eventos DOM puede informarle de que, por ejemplo, elemento <video> iniciar la reproducción, pausa, parada, y así sucesivamente.
Ejemplos de método simple, que muestran cómo utilizar el elemento <video>, leer y establecer las propiedades, y cómo invocar métodos.
Creación de un simple juego / pausa en el vídeo y cambiar el tamaño de los controles:
El ejemplo anterior llama a dos métodos: play () y pausa (). También utiliza dos propiedades: una pausa y anchura.
Trate »Ver la referencia para más Manual de HTML5 Audio / Video Referencia DOM .
标签 | 描述 |
---|---|
<video> | 定义一个视频 |
<source> | 定义多种媒体资源,比如 <video> 和<audio> |
<track> | 定义在媒体播放器文本轨迹 |