2016-07-28 5 views
4

私はビデオの特定の部分でYouTubeビデオループを作りようとしています。開始および終了するループ上のYouTube動画のセクションを再生するには?

start=30&end=33 

それループにするには:私が知っているから、

https://www.youtube.com/v/zeI-JD6RO0k?autoplay=1&loop=1&start=30&end=33&playlist=%20zeI-JD6RO0k

autoplay=1&loop=1&playlist=%20zeI-JD6RO0 

問題はそれがないということです指定した時刻に次のループを開始する

答えて

5

Youtube Iframe-APIを使用して、ビデオセクションをループすることができます。

置き、あなたのHTMLページでこのタグ:

var section = { 
    start: 30, 
    end: 33 
}; 

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

function onPlayerReady(event) { 
    player.seekTo(section.start); 
    player.playVideo(); 
} 

function onPlayerStateChange(event) { 
    if (event.data == YT.PlayerState.PLAYING) { 
    var duration = section.end - section.start; 
    setTimeout(restartVideoSection, duration * 1000); 
    } 
} 

function restartVideoSection() { 
    player.seekTo(section.start); 
} 

See this example in action

<!-- 1. The <iframe> (and video player) will replace this <div> tag. --> 
<div id="player"></div> 

ロードYouTubeのにiFrame API

// 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); 

は、プレイヤーとループ動画を作成します。

関連する問題