Менять видео по щелчку мыши?

У меня есть два видео, и я хочу зациклить первое видео, пока пользователь не щелкнет мышью, после чего я хочу переключиться на воспроизведение второго видео. Кто-нибудь знает, как лучше всего это сделать?

Изменить: Извините, чтобы уточнить, я бы предпочел использовать HTML 5 (при условии, что это возможно). Я пытаюсь сделать так, чтобы два видео плавно менялись, одно поверх другого. Я хочу, чтобы это выглядело как щелчок мышью, чтобы закончить видео или сделать прогресс. Поэтому мне нужно приостановить / скрыть первый и показать / воспроизвести второй.

Обновление: с помощью Галена и некоторых поисков в Google я понял это:

<html xmlns="http://www.w3.org/1999/xhtml">
<script type="text/javascript">
function swapVideos() {
    var video1 = document.getElementsByTagName('video')[0];
    video1.pause();
    video1.style.display = 'none';
    var video2 = document.getElementsByTagName('video')[1];
    video2.play();
}
</script>
<body>
<video src="video1.ogg" controls="controls" loop="loop" autoplay="autoplay" onclick="swapVideos();">
your browser does not support the video tag
</video>
<video src="video2.ogg" controls="controls" preload="preload">
your browser does not support the video tag
</video>
</body>
</html>
Источник

2 ответа

Решение

Добавьте этот код в событие клика того, что вы хотите

// pause first video
var video1 = document.getElementsByTagName('video')[0];
video1.pause();
// play second video
var video2 = document.getElementsByTagName('video')[1];
video2.play();

Добавьте это, чтобы сделать первый цикл видео

var video1 = document.getElementsByTagName('video')[0];
video1.addEventListener('ended', function () {
    video1.play();
});
Источник

Трудно быть конкретным с информацией, которую вы предоставили, но вы можете использовать javascript или jquery для этого. Привязать событие клика к элементу DOM и по клику изменить источник видео. Я предполагаю, что видео определяется параметром источника в SWF.

Источник
Другие вопросы по тегам