web-dev-qa-db-fra.com

Démarrer la vidéo HTML5 à une position particulière lors du chargement?

J'essaie de lire une vidéo HTML5 (VP8 codée). Ce que je veux, c'est jouer à une certaine position. Disons au bout de 50 secondes.

J'ai essayé mais il semble y avoir un problème. Pouvez-vous suggérer s'il y a quelque chose que je fais mal?

Voici le code:

   <video id="vid1" width="640" height="360">
       <source src="file.webm" type="video/webm" /> 
       Your browser does not support the video tag.
   </video>
   <script>
       document.getElementById('vid1').currentTime = 50;
   </script>

J'ai essayé mais ça ne marche pas. Lorsque la vidéo est chargée, la lecture commence au début. Cependant, si j'appelle cela pendant la lecture, comme après un certain temps, cela fonctionne bien. Y a-t-il quelque chose qui me manque?

javascripthtml5-video
74
Johnydep

Vous devez attendre que le navigateur connaisse la durée de la vidéo avant de pouvoir rechercher une heure précise. Donc, je pense que vous voulez attendre l'événement 'Loadmetadata' comme ceci:

document.getElementById('vid1').addEventListener('loadedmetadata', function() {
  this.currentTime = 50;
}, false);
109
Richard M

Vous pouvez créer un lien direct avec Media Fragments URI , il suffit de changer le nom du fichier en file.webm # t = 50

Voici un exemple

C'est plutôt cool, vous pouvez faire toutes sortes de choses. Mais je ne connais pas l’état actuel de la prise en charge du navigateur.

43
rlovtang

SANS UTILISER JAVASCRIPT

Ajoutez simplement #t=[(start_time), (end_time)] à la fin de votre URL de média. Le seul inconvénient (si vous voulez le voir ainsi) est de savoir combien de temps votre vidéo indique l'heure de fin. Exemple:

<video>
    <source src="splash.mp4#t=10,20" type="video/mp4">
</video>

Notes: Non supporté par IE

42
anita

ajustez l'heure de début et de fin de la vidéo lorsque vous utilisez la balise video en html5;

http://www.yoursite.com/yourfolder/yourfile.mp4#t=5,15

où gauche de la virgule est l'heure de début en secondes, à droite de la virgule est l'heure de fin en secondes. déposez la virgule et l'heure de fin pour appliquer l'heure de début uniquement.

26
BobK

Utilisant un #t=10,20 fragment a fonctionné pour moi.

4
Kamila

Sur Safari Mac pour une source HLS, je devais utiliser l'événement loadeddata au lieu de l'événement métadonnées.

3
Robert Reinhardt