@undying234

Почему код не останавливает видео в iframe?

Я почти полностью скопировал код с https://developers.google.com/youtube/iframe_api_r...?, но код не работает.
Помогите!!!
Вот код html:
<body>
     <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
    <div class="video-wrapper">
      <div class='video-list'>
        <div class='video'>
          <div class='video_in_list'><iframe 
                              title='BioMutant Announcement Trailer (from ex-Just Cause Devs)' 
                              width="640" height="360" 
                              src="https://www.youtube.com/embed/73vSguCeJl0?feature=oembed" 
                             frameborder="0" 
                             allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 
                             allowfullscreen 
                             id="video_iframe">
                     </iframe>
           </div>
        </div>
      </div>
    </div>


<script src="script.js"></script>
</body>

Вот код js:
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

// 3. This function creates an <iframe> (and YouTube player)
//    after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
  player = new YT.Player('video_iframe', {
    height: '360',
    width: '1020',
    videoId: 'M7lc1UVf-VE',
    events: {
      'onReady': onPlayerReady,
      'onStateChange': onPlayerStateChange
    }
  });
}

// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
  event.target.playVideo();
}

// 5. The API calls this function when the player's state changes.
//    The function indicates that when playing a video (state=1),
//    the player should play for six seconds and then stop.
var done = false;
function onPlayerStateChange(event) {
  if (event.data == YT.PlayerState.PLAYING && !done) {
    setTimeout(stopVideo, 6000);
    done = true;
  }
}
function stopVideo() {
  player.stopVideo();
}

Вот ссылка: https://codepen.io/undy11203/pen/wvJEJJW
  • Вопрос задан
  • 99 просмотров
Пригласить эксперта
Ответы на вопрос 1
YavaDev
@YavaDev
Я почти полностью скопировал код
Вот именно, что почти.

Надо заменить этот код в html:
<div class='video_in_list'>
    <iframe 
        title='BioMutant Announcement Trailer (from ex-Just Cause Devs)' 
        width="640" height="360" 
        src="https://www.youtube.com/embed/73vSguCeJl0?feature=oembed" 
        frameborder="0" 
        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 
        allowfullscreen 
        id="video_iframe">
    </iframe>
</div>


На этот:
<div id='video_iframe'></div>
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы