YouTubeの音楽プレーヤーサイトを作ろう!その2

音楽

埋め込みプレーヤーのコントロール

「音楽プレーヤーサイトを作ろう」第2弾として、YouTube動画の埋め込みプレーヤーをjavascriptでコントロールしていきます。前回作成した埋め込みプレーヤーである、onYouTubeIframeAPIReady関数内で指定している「ytPlayer」に対しての処理を記述することで、プレーヤーに対する処理を行えます。

コントロール処理

埋め込みプレーヤーに対する処理は次のように記述します。

  • 再生:ytPlayer.playVideo();
  • 一時停止:ytPlayer.pauseVideo();
  • 現在の再生時間取得:ytPlayer.getCurrentTime();
  • シークバーの移動:ytPlayer.seekTo(秒数);
  • 現在の音量取得:ytPlayer.getVolume();
  • 音量調整:ytPlayer.setVolume(音量プラスマイナス);
  • ミュートされているかどうか:ytPlayer.isMuted()
  • ミュート:ytPlayer.mute();
  • ミュートの解除:ytPlayer.mute();

これらの操作を行うボタンを設置して動作確認します。

埋め込みプレーヤーのコントロール実装

HTMLとjavascriptで実装すると、このようになります。

無事、プレーヤーの操作が可能になりました。

 まとめ

今回はYouTube動画の埋め込みプレーヤーに対するjavascriptでのコントロール処理を行いました。

次回はYouTube動画の検索を行います。

コメント

タイトルとURLをコピーしました