En el ejemplo cargar un vídeo con HTML5 veíamos una forma sencilla de cargar un vídeo del formato Ogg con código HTML5. En este caso vamos a ver cómo cargar un vídeo desde diferentes orígenes con diferentes formatos.
Es decir, vamos a indicarle a nuestro navegador dónde puede encontrar diferentes formatos. Esto se hace así debido a que el navegador puede no reconocer y cargar alguno de los formatos. En ese caso, al indicarle una lista, cargará el primero de los formatos que consiga interpretar.
Recordamos los formatos con los que se trabaja en HTML5:
- MPEG-4, extensiones .mp4 o .m4v
- Flash, la extensión .flv
- Ogg, la extensión .ogv
- WebM, extensión .webm
Si el formato es único nos vale con indicar el origen en el atributo src del elemento VIDEO.
Pero para cargar un vídeo de diferentes formatos con HTML5 tenemos que apoyarnos en el elemento SOURCE. El elemento SOURCE contendrá un atributo src que indique el origen del vídeo y otro atributo type dónde indicaremos el tipo del elemento multimedia que vamos a cargar.
El elemento SOURCE será un elemento anidado dentro del elemento VIDEO.
Así, nuestro código para que el vídeo pueda ser cargado de diferentes formatos es el siguiente: