2017-02-16 15 views
3

Мне удалось запустить видеоролик и закончить видео в нужное мне время, но есть ли способ его зацикливания? Опция цикла, похоже, мало что делает.YouTube API - Циклическое видео между заданными начальными и конечными временами

Fiddle:https://jsfiddle.net/u7nkz292/

Код:

<div id="ytplayer"></div> 



<script> 
    // Load the IFrame Player API code asynchronously. 
    var tag = document.createElement('script'); 
    tag.src = "https://www.youtube.com/player_api"; 
    var firstScriptTag = document.getElementsByTagName('script')[0]; 
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

    // Replace the 'ytplayer' element with an <iframe> and 
    // YouTube player after the API code downloads. 
    var player; 
    function onYouTubePlayerAPIReady() { 
    player = new YT.Player('ytplayer', { 
     height: '360', 
     width: '640', 
     videoId: 'M7lc1UVf-VE', 
      playerVars: { 
     autoplay: 1,  // Auto-play the video on load 
     controls: 0,  // Show pause/play buttons in player 
     showinfo: 0,  // Hide the video title 
     modestbranding: 1, // Hide the Youtube Logo 
     fs: 1,    // Hide the full screen button 
     cc_load_policy: 0, // Hide closed captions 
     iv_load_policy: 3, // Hide the Video Annotations 
     start: 36, 
     end: 45, 
     loop: 1,   // Run the video in a loop 
     autohide: 0   // Hide video controls when playing 
    }, 
    }); 
    } 
</script> 
+0

Проверьте это [ссылка] (http://stackoverflow.com/questions/19410789/youtube-player-api-with-loop) –

ответ

5

Вы можете реализовать onStateChange обратного & нагрузку, видео с тем же параметром startSeconds & endSeconds с loadVideoById:

// Load the IFrame Player API code asynchronously. 
var tag = document.createElement('script'); 
tag.src = "https://www.youtube.com/player_api"; 
var firstScriptTag = document.getElementsByTagName('script')[0]; 
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

var videoId = 'M7lc1UVf-VE'; 
var startSeconds = 36; 
var endSeconds = 45; 

// Replace the 'ytplayer' element with an <iframe> and 
// YouTube player after the API code downloads. 
var player; 

var playerConfig = { 
    height: '360', 
    width: '640', 
    videoId: videoId, 
    playerVars: { 
    autoplay: 1, // Auto-play the video on load 
    controls: 0, // Show pause/play buttons in player 
    showinfo: 0, // Hide the video title 
    modestbranding: 1, // Hide the Youtube Logo 
    fs: 1, // Hide the full screen button 
    cc_load_policy: 0, // Hide closed captions 
    iv_load_policy: 3, // Hide the Video Annotations 
    start: startSeconds, 
    end: endSeconds, 
    autohide: 0, // Hide video controls when playing 
    }, 
    events: { 
    'onStateChange': onStateChange 
    } 
}; 

function onYouTubePlayerAPIReady() { 
    player = new YT.Player('ytplayer', playerConfig); 
} 

function onStateChange(state) { 
    if (state.data === YT.PlayerState.ENDED) { 
    player.loadVideoById({ 
     videoId: videoId, 
     startSeconds: startSeconds, 
     endSeconds: endSeconds 
    }); 
    } 
} 

Here является Fiddle

+0

Это отлично. Спасибо! – Nick