Приостановить все видео в iframe src

Question

Я использую iframe встроить MP4 видео с S3.

<iframe class="you1" src="https://s3-us-west-2.amazonaws.com/vidcuratorfx2training/Video+1.mp4"></iframe>

Но это видео автоматически воспроизводится при загрузке. Поскольку на странице несколько видео, все видео начинают воспроизводиться автоматически.

Я пытался приостановить все видео, используя код ниже js, но он не работает.

<script>
    window.onload = function() {
        var frames = document.getElementsByTagName("iframe");
        for (var i = 0; i< frames.length; i++) {
            var innerDoc = (frames.item(i).contentDocument) ? 
                frames.item(i).contentDocument : frames.item(i).contentWindow.document;
            var iframeVideoTags = innerDoc.getElementsByTagName("video");
            for (var j = 0; j < iframeVideoTags.length; j++) {
                iframeVideoTags.item(j).pause();
            }
        }
    }
</script>

Мои ограничения CSS ограничивают использование тега видео HTML5. Мне нужно использовать только iframe.

Как загрузить видео iframe, приостановленные по умолчанию?

Answer 1

Проверь это

<video width="400" controls>
  <source src="mov_bbb.mp4" type="video/mp4">
  <source src="mov_bbb.ogg" type="video/ogg">
  Your browser does not support HTML5 video.
</video>

Но, используя приведенный выше код, вам нужно добавить два разных формата видео для поддержки разных браузеров.

Моим лучшим предложением было бы загрузить ваше видео на YouTube и добавить ссылку на YouTube в "iFrame's src". Преимущества использования youtube url в том, что youtube обрабатывает все возможности, такие как вы, сводите экран к минимуму и другие