martes, 18 de julio de 2017

Trucos para el blog (2)

Incluir un video en el blog

Para insertar un video en HTML5 debes incluir este código en tu página:

<video width="320" height="240" controls>
<source src="URL del archivo mp4" type="video/mp4">
<source src="URL del archivo ogv" type="video/ogg">
¡Hola usuario de Internet Explorer!, ¿qué crees? aquí se está reproduciendo un video increíble, pero no puedes verlo porque tu navegador es antiguo :(
</video>


En rojo lo que tienes que cambiar tú. El hecho de tener que ponerlo en dos formatos es para que puedan verlo distintos navegadores ya que hay alguno que no abre archivos mp4.

Los atributos del elemento AUDIO y VIDEO son: controls, autoplay, loop, muted, y preload

  • controls permite que se muestren los controles y el reproductor en sí.
  • autoplay hace que el archivo se reproduzca al cargar la página.
  • loop reproducirá el archivo una y otra vez.
  • muted quitará el audio del archivo.
  • preload define si el reproductor se debe cargar cuando se cargue la página.
Acuerdate que para centrar el video tienes que poner antes del código la etiqueta:

<div style="text-align: center;">      y no te olvides de cerrarla con      </div>

En el presente caso hemos incluido el siguiente código:

<div style="text-align: center;">
<video width="670" height="480" controls>
<source src="https://www.aviasalon.com/2017/media/MAKS17_5_x264_2.mp4" type="video/mp4">
<source src="URL del archivo ogv" type="video/ogg">
¡Hola usuario de Internet Explorer!, ¿qué crees? aquí se está reproduciendo un video increíble, pero no puedes verlo porque tu navegador es antiguo :(
</video>
</div>

No hay comentarios:

Publicar un comentario