Блог

Главная - Вопросы по программированию - Как воспроизводить и объединять видео html5 в IOS?

Как воспроизводить и объединять видео html5 в IOS?

#javascript #ios #video #safari #html5-video

#javascript #iOS #Видео #safari #html5-видео

Вопрос:

Я пытаюсь связать 2 видео: когда первое заканчивается, второе начинает воспроизводиться автоматически.

Он работает в Chrome или Firefox в W10 и Ubuntu, но я не могу найти способ заставить его работать в IOS: Safari или Chrome или Firefox. Это как «Video_2.play();» не запускается внутри «Video_1.addEventListener (…)» в IOS.

Что я пропустил?

 var Video_1 = document.getElementById("ID_Video_1");
var Video_2 = document.getElementById("ID_Video_2");


Video_1.addEventListener('loadedmetadata',function() {
    alert("Can start playing video Video_1");
    Video_1.play();
});

Video_2.addEventListener('loadedmetadata',function() {
    alert("Can start playing video Video_2");
});

Video_1.addEventListener('ended', function(e) {
    alert("Video_1 ENDED");
    Video_2.style.visibility = "visible";
    Video_1.style.visibility = "hidden";
    Video_2.play();
    alert("Video_2.play();");
    });  
 #DIV_video {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 430px;
    height: 270px;
    }

.CLASS_Video {
    position: absolute;
    top: 0;
    left: 0;
}

#ID_Video_1 {
    visibility: visible;
    z-index: 1;
    }

#ID_Video_2 {
    visibility: hidden;
    z-index: 2;
    }  
 <div id="DIV_video">

<video id="ID_Video_2" playsinline class="CLASS_Video" width="150" src="http://www.w3schools.com/html/mov_bbb.mp4"></video>
<video id="ID_Video_1" playsinline class="CLASS_Video" width="150" src="http://www.w3schools.com/html/movie.mp4"></video>

</div>

Ответ №1:

Я думаю, что нашел ответ :

https://webkit.org/blog/6784/new-video-policies-for-ios/

И теперь я думаю, что для меня нет решения в IOS, даже если это Chrome или Firefox…