Привязка события к определенному фрагменту видео
Добра!
Хочу привязать event(событие) к определенному фрагменту видео(~4,5 сек). Оно проигрывается бесконечно. Привязаться хочу к началу видео. Событие должно срабатывать каждый раз, когда видео начинает проигрываться сначала. Есть ли для этого какое-либо событие? Или какие-либо иные инструменты.. P.S. Видео формата Webm |
Вопрос снят.
P.S. Можно получить текущую продолжительность: element.currentTime; Написал функцию для события. |
Поделюсь функцией, которую быстро накидал.
feedback приветствуется.
window.onload = function() {
var curtimeBe = video1.currentTime;
function eventVideo(){
if( video1.currentTime < curtimeBe){
// ( .. ) здесь событие по первым кадрам видео
// ( .. )
}
setTimeout(eventVideo, (30.7-video1.currentTime)*1000 )
// console.log(video1.currentTime)
}
eventVideo();
};
}
После загрузки видео задаем SetTimeout через функцию eventVideo, которое запуститься ближе к концу видео. В коде выше, это 30.7 (продолжительность всего видео). Подогнать можно раздокументировав console.log и посмотреть как часто выполняется. Лучше задавать не ближе 0.100 секунды. Функция подвешивания события на видео. которое крутиться бесконечно. Событие будет в начала видео. |
Событие timeupdate
<video id="video1" controls autoplay loop src="https://sample-videos.com/video123/mp4/240/big_buck_bunny_240p_1mb.mp4"></video>
<output id="out"></output>
<script>
video1.addEventListener("timeupdate", (last => ({ target }) => {
var p = target.currentTime >= 2; // или другое время вместо 2-ой секунды
if(p && p !== last) {
out.append(document.createElement("br"), "Event!", target.currentTime);
}
last = p;
})());
</script>
Или playing, если нужно вначале
<video id="video1" controls autoplay loop src="https://sample-videos.com/video123/mp4/240/big_buck_bunny_240p_1mb.mp4"></video>
<output id="out"></output>
<script>
video1.addEventListener("playing", ({ target }) => {
if(target.currentTime < 1) out.append(document.createElement("br"), "Event!", target.currentTime);
});
</script>
|
Цитата:
|
| Часовой пояс GMT +3, время: 21:23. |