Запуск HTML5 Видео в определенной позиции при загрузке?

Я пытаюсь воспроизвести видео HTML5 (VP8 в кодировке). Я хочу играть на определенной позиции. Скажем, на Время 50 секунд вперед.

Я пробовал, но там, кажется, некоторые проблемы. Вы можете предложить, если есть что-то, что я делаю неправильно?

вот код: 

   <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>

Я пробовал но он не работает. Когда видео загружается, он просто начинает играть с начала. Однако если я во время воспроизведения как через некоторое время видео играет он отлично работает. Есть ли что-то, что я упускаю?

6 64
javascript html5-video

6 ответов:

вы должны ждать, пока браузер не узнает продолжительность видео, прежде чем вы можете искать в определенное время. Итак, я думаю, что вы хотите дождаться события "loadedmetadata" примерно так:

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

вы можете напрямую связаться с медиа фрагменты URI, просто измените имя файла, чтобы .webm#t=50

вот пример

Это довольно круто, вы можете делать все виды вещей. Но я не знаю текущее состояние поддержки браузера.

39

БЕЗ ИСПОЛЬЗОВАНИЯ JAVASCRIPT

просто добавить #t=[(start_time), (end_time)] до конца вашего медиа URL. Единственная неудача (если вы хотите видеть это таким образом) - вам нужно знать, как долго ваше видео будет указывать время окончания. пример:

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

Примечания: не поддерживается в IE

28

настройка времени начала и окончания видео при использовании тега видео в html5;

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

где слева от запятой-время начала в секундах, справа от запятой-время окончания в секундах. отбросьте запятую и время окончания, чтобы применить только время начала.

25

С помощью #t=10,20 фрагмент работал на меня.

3

на Safari Mac для источника HLS мне нужно было использовать событие loadeddata вместо события метаданных.

2