Автоматически воспроизводить и зацикливать массив видео, а также изменять CSS с каждым - PullRequest
0 голосов
/ 19 октября 2018

Во-первых, я являюсь новичком в коде, и я ценю, что мое невежество не может быть слишком желанным.Тем не менее, если вы готовы потворствовать мне и помогать мне, я был бы очень признателен.

Итак, похоже, что в предыдущие годы и в ответ на других людей люди выражали http://stackoverflow.com/questions/17521012/html5-video-loop-src-change-on-end-play-function-not-working какответ на первую часть моего вопроса.Код из вышеупомянутого ответа:

<video id="homevideo" width="100%" autoplay onended="run()">
    <source src="app/video1.mp4" type='video/mp4'/>
</video>

&

video_count =1;
videoPlayer = document.getElementById("homevideo");

function run(){
        video_count++;
        if (video_count == 4) video_count = 1;
        var nextVideo = "app/video"+video_count+".mp4";
        videoPlayer.src = nextVideo;
        videoPlayer.play();
   };

Однако, чтобы расширить это, как можно построить это, если видео не следуют за видео [число] .mp4соглашение об именовании?Я должен сказать, что я нашел и попробовал решение, предлагаемое здесь , но оно только зациклило бы первое видео и по какой-то причине не воспроизвело бы другие.

Наконец, и дополнительно, я 'Мне бы хотелось, чтобы к каждому видео было прикреплено заранее заданное изменение CSS.Например, когда воспроизводится конкретное видео, цвет фона родительского элемента изменится на назначенный цвет.То же самое будет происходить с каждым из видео в массиве, каждое из которых имеет заранее определенный цвет, на который цвет фона изменится.

Если люди могут предложить решение, а также кратко объяснить его так, чтобыЯ надеюсь, я узнаю, что это было бы потрясающе!

Большое спасибо заранее, люди.

1 Ответ

0 голосов
/ 19 октября 2018

Просто создайте массив с классами, соответствующими вашим видео:

var example = ['foo', 'bar', 'faz', 'video4'];

И затем вы установите его в своем цикле после var nextVideo (у вас уже есть этот счетчик, просто используйте его повторно);

var videoPlayer.classList = example[video_count-1]; // -1 as you count from 1->4, but the array 0->3
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...