Youtube埋め込みビデオの開始/停止イベント

iframeを介してYouTube動画を埋め込むのは、onStartやonStopのような特定のイベントを公開していますか？Youtube埋め込みビデオの開始/停止イベント

2012-05-14 Ace Trajkov

この起動と停止イベントを処理する例：

HTMLファイル（index.htmlを）：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Stackoverflow</title> 
     <script type="text/javascript" src="http://www.youtube.com/player_api"> </script> 
     <script type="text/javascript" src="sof.js"> </script> 
    </head> 
    <body> 
     <div id="player"></div> 
    </body> 
</html>

とJavaScript（sof.js）：については

var player; 
// This function creates an <iframe> (and YouTube player) 
// after the API code downloads. 
function onYouTubePlayerAPIReady() { 
    player = new YT.Player('player', { 
     height: '390', 
     width: '640', 
     videoId: 'u1zgFlCw8Aw', 
     events: { 
      'onStateChange': function (event) { 
       switch (event.data) { 
        case -1: 
         console.log ('unstarted'); 
         break; 
        case 0: 
         console.log ('ended'); 
         break; 
        case 1: 
         console.log ('playing'); 
         break; 
        case 2: 
         console.log ('paused'); 
         break; 
        case 3: 
         console.log ('buffering'); 
         break; 
        case 5: 
         console.log ('video cued'); 
         break; 
       } 
      } 
     } 
    }); 
}

それぞれの場合、ハンドラを設定できます。さらに詳細については

：

出典

2012-05-14 09:29:00 Wilk

Excelent、これは私が必要としたものです –

あなたはawsome Wikです。この投稿への+1。 –

私は、同様のYouTubeの例を詳しく説明しているブログ記事を書きましたが、少し別の戦略が必要です：http://www.objectpartners.com/2013/08/21/triggering-a-youtube-video-from-clicking-a-終了時のボタンイメージと置き換え/ –

のみ使用イベントは以下のとおりです。

1 - onStateChange 
2 - onPlaybackQualityChange 
3 - onError 
4 - onApiChange

- イベントハンドラ：

1 - onYouTubePlayerReady（playerid）

出典

2012-05-14 09:29:20 HGK

Youtube埋め込みビデオの開始/停止イベント

答えて

関連する問題