Воспроизведение бесконечно зацикливающегося видео При загрузке в HTML5
Я ищу, чтобы разместить видео на странице HTML5, которая начнет играть на странице загрузки, и после завершения цикла назад к началу без перерыва. Видео также должно не есть какие-либо элементы управления, связанные с ним, и либо быть совместимым со всеми "современными" браузерами, или иметь возможность polyfill.
раньше я бы сделал это через Flash
и FLVPlayback
, но я бы предпочел держаться подальше от Flash
в сфере HTML5. Я думаю, что мог бы использовать javascript setTimeout
для создания плавного цикла, но что я должен использовать для встраивания самого видео? Есть ли что-то там, что будет транслировать видео в путь FLVPlayback
будет?
2 ответов
на цикл атрибут должен это сделать:
<video width="320" height="240" autoplay loop>
<source src="movie.mp4" type="video/mp4" />
<source src="movie.ogg" type="video/ogg" />
Your browser does not support the video tag.
</video>
если у вас возникли проблемы с атрибутом loop (как и в прошлом), слушайте videoEnd
событие и назвать play()
метод, когда он стреляет.
Note1: я не уверен в поведении на iPad/iPhone от Apple, потому что у них есть некоторые ограничения против autoplay
.
примечание 2: loop="true"
и autoplay="autoplay"
не рекомендуется
вы можете сделать это двумя способами:
1) с помощью loop
атрибут в элементе video (упоминается в первом ответе):
2), и вы можете использовать ended
медиа-событие:
window.addEventListener('load', function(){
var newVideo = document.getElementById('videoElementId');
newVideo.addEventListener('ended', function() {
this.currentTime = 0;
this.play();
}, false);
newVideo.play();
});