How to Control YouTube AutoPlay and Play after another video end


今天被一個朋友問起如何控制embed的YouTube影片,讓他可以自動撥放也可以在播放完後讓另外一個embed的影片也播放。

這邊先介紹一下官方的API ─ Youtube IFrame API

What is Youtube IFrame API

Youtube iFrame API是Google官方提供的一組JavaScript Library讓我們可以輕鬆控制嵌入的影片,但不同於FlashJavaScript player API都在網頁內嵌入一個Flash object的概念,IFrame API 使用 <iframe> tag ,在HTML5的支援下這提供了更穩固的播放基礎。

它目前的功能包括:

  • Play(include seeks to a specified time), Pause and Stop Video
  • Video information
  • Queueing functions
  • Quality、Mute、Volume、Screen Size Control
  • Can Get Player State
    • 1 – unstarted
    • 0 – ended
    • 1 – playing
    • 2 – paused
    • 3 – buffering
    • 5 – video cued

Hand on Lab

在開發上主要透過Create 一個YT.Player object的方式去操控處理,基本的操控如下:

JS Bin

接下來介紹如何使用這個API1幫我們完成在ㄧ個Player播放完影片後自動trigger另外一個player播放,範例如下:

JS Bin

如此一來透過這個API我們就可以很輕鬆的處理影片播放的任何需求了


作者: Blackie
版權聲明: 本站所有文章除特別聲明外,均採用 CC BY 4.0 許可協議。轉載請註明來源 Blackie !
 上一篇
JavaScript reserved word(保留字) JavaScript reserved word(保留字)
這禮拜在看以前的code的時候看到前人使用保留字的來宣告變數名稱的js code,可能當時的時空背景允許這樣的事情發生,但想到以後如果部門還有小朋友的話要告訴他們的正確的觀念所以寫了這篇來Memo一下。
2014-04-14
下一篇 
  目錄