映像制作 eラーニングのことならビズバレー
文字サイズの変更 標準 
大きい
ホーム > スタッフブログ
スタッフブログ
k.takahashi
k.taguchi
j.hashimoto
j.katou
y.hotate
m.kawai
s_inomata
m_muraoka
ビズバレーは、東京都 千代田区で活動する、映像制作、DVD、eラーニングを扱う会社です。

JavaScriptでYouTubeの動画を制御してみましょう。
プログラムで制御することで、任意のタイミングで動画を再生したり、別の動画に切り替えることができます。

今回は、シンプルに動画を表示した後、JavaScriptで「再生」「一時停止」「最初から再生」「別の動画に切り替える」ことができるサンプルを作ってみました。



ポイントとなるコード記述は、「動画部分」の箇所で、動画表示を行います。「制御部分」は、コントローラ下の各リンクをクリックしたとき、再生、一時停止といった制御をしているので、書き換えることでいろいろな動作を行うことができます。


swfobject.js は、JavaScriptでFlashの制御を行うライブラリです。ダウンロードして利用します。
https://code.google.com/p/swfobject/

制御に関しては、「YouTube ActionScript 3.0 Player API リファレンス」をご参考ください。
https://developers.google.com/youtube/flash_api_reference?hl=ja

自動再生などの制御方法も載っていますので参考になると思います。なお、この方法は、YouTubeの映像をHTML5ビデオとして再生することは出来ませんので、iOSでは表示することはできません。注意が必要です。

別ウインドウでサンプルを動かす