YouTubeを埋め込む

※クラス名・jQueryのセレクタは任意です。仮にyoutubeとします。

基本的にこれだけ。data-idにYouTubeの動画IDを設定します。

<div class="youtube" data-id="FUgM105uN4c" data-width="1920" data-height="1080"></div>

$('.youtube').bcYoutube();

（※ v0.0.16-alphaで実装中、v0.1.0ではきちんと実装予定）

HTML側でdata-idにYouTubeのIDをカンマ区切りで設定します。

<div class="youtube" data-id="FUgM105uN4c,KAuzzR56KvU" data-width="1920" data-height="1080"></div>

JS側でオプションで指定します。

$('.youtube').bcYoutube({
    rel: false,
    autoplay: true,
    stopOnInactive: true,
    controls: false,
    loop: true,
    showinfo: false
});

プロパティ	型	初期値	説明
rel	boolean	false	関連動画を再生後に表示させるかどうか
autoplay	boolean	true	自動再生させるかどうか
stopOnInactive	boolean	false	ウィンドウがアクティブでなくなった時に再生を停止するかどうか
controls	boolean	false	コントロールを表示させるかどうか
loop	boolean	true	ループ再生するかどうか
showinfo	boolean	false	タイトル・動画情報を表示させるかどうか

次回は YouTube動画を背景にする方法を解説します。