IFrame Player APIの関数を利用する（プレーヤーのサイズの設：setSize）

IFrame Player APIの関数を利用する（プレーヤーのサイズの設：setSize）

以下のサンプルでは onStateChangeイベント内でsetSizeを使用しています。 再生時、576×342、停止時、480×285としています。

サンプルコード

<div id="ytplayer"></div> <script> // API読み込み script = document.createElement( 'script' ); script.src = "//www.youtube.com/iframe_api"; firstScript = document.getElementsByTagName( 'script' )[ 0 ]; firstScript.parentNode.insertBefore( script , firstScript ); // 動画呼び出し function onYouTubeIframeAPIReady() { player = new YT.Player('ytplayer', { height: '285', width: '480', events: { 'onStateChange': onPlayerStateChange }, videoId: 'M7lc1UVf-VE' }); } // onStateChangeのコールバック関数 function onPlayerStateChange(event) { var status = event.data; if(status == 1) { player.setSize(576, 342); } else if(status == 2) { player.setSize(480, 285); } } </script>

サンプル

Youtube API メモ Indexへ戻る