Parar la descarga de un vídeo en HTML5

21/Ene/2012 HTML5 2 Comentarios

Cuando cargamos un vídeo en HTML5 el navegador buscará el origen del vídeo, comprobará si puede visualizar el tipo de vídeo que se le indica como origen y validará si los codecs son correctos. Un vez hecho eso empezará la descarga del vídeo, es decir, empezará a descargar el contenido del vídeo hasta el final del mismo.

Pero qué pasa si no queremos seguir visualizando el vídeo, si queremos parar la descarga con el fin de que no se consuma ancho de banda de nuestra conexión.

Veamos como hacerlo. De primeras veremos que en el DOM nos encontramos el elemento HTMLMediaElement con un método .pause(). Si ejecutamos dicho método solo pararemos la ejecución del contenido multimedia, pero no se parará la descarga del vídeo, es decir, la imagen la veremos congelada, pero el navegador seguirá descargándose el contenido.

  1. var v = document.getElementById("mivideo");
  2. v.pause();

Pero para poder parar la descarga de un vídeo en HTML5 no nos valdrá solo con el método .pause(), si no que tenemos que jugar con el atributo .src, al cual desasignaremos el valor, es decir, le daremos el valor de una cadena vacía. Una vez parado el vídeo y desasignado el valor de su atributo .src conseguiremos parar la descarga.

  1. var v = document.getElementById("mivideo");
  2. v.pause();
  3. v.src="";

En el caso de Firefox no sirve solo con desasignar la cadena .src, si no que tendremos que realizar la carga del nuevo valor mediante el método .load(). Esto producirá que se envíe el evento abort del HTMLMediaElement. Si bien habremos conseguido parar la descarga de un vídeo en HTML5.

  1. var v = document.getElementById("mivideo");
  2. v.pause();
  3. v.src="";
  4. v.load();

Vídeos sobre HTML5


Difunde el Conocimiento

Si te ha gustado el artículo o te ha sido de utilidad, no dejes de compartirlo con tus amigos en las redes sociales... Te estaremos muy agradecidos. :-D

¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*

*