モーダルウィンドウ（LightBox的なポップアップ）でYoutubeを開いた時に自動的にYoutubeの動画がスタートするって、なかなかめんどくさいみたいで…
モーダルウィンドウ系のjQueryのライブラリだと結構めんどくさそうだったので、YouTube Player iframe APIを利用した実装方法のメモ

【HTML】

<div class="youtube">
  <a id="modal-open" href="">
    <img src="img/youtube_thm.png" alt="サムネイル画像">
  </a>
</div>

【jQuery】

$(function(){
    'use scrict';

    //プレイヤー変数
    var player;

    //オブジェクト生成
    function youtubeAPIInit() {
        var scriptTag = document.createElement('script');
        scriptTag.src = "https://www.youtube.com/iframe_api";
        var fsTag = document.getElementsByTagName('script')[0];
        fsTag.parentNode.insertBefore(scriptTag, fsTag);
        window.onYouTubeIframeAPIReady = function(){
            player = new YT.Player('player', {
                height:'540',
                width:'960',
                videoId:'OmsAkXakEuA’, ←Youtubeの動画ID
                playerVars:{
                    autohide:1,
                    controls:1,
                    modestbranding:1,
                    iv_load_policy:3,
                    showinfo:0,
                    rel:0,
                    autoplay:1  ←自動再生するパラメーター
                }
            });
        };
    }

    //モーダル
    var modal = {}, $lay, $content;
    modal.inner = function() {
        if($("#modal-overlay")[0]) return false;
        $("body").append('<div id="modal-overlay"></div>');
        $lay = $("#modal-overlay");
        $content = $("#modal-content");
        $lay.fadeIn("slow");
        youtubeAPIInit();
        this.resize();
        $content.fadeIn("fast");
        $lay.unbind().click(function() {
            player.pauseVideo();
            $content.add($lay).fadeOut("fast",function(){
                $lay.remove();
            });
        });
    };

    //リサイズ処理
    modal.resize = function(){
        var $winWidth = $(window).width();
        var $winHeight = $(window).height();
        var $contentOuterWidth = $("#modal-content").outerWidth();
        var $contentOuterHeight = $("#modal-content").outerHeight();
        $("#modal-content").css({
            "left": (($winWidth - $contentOuterWidth) / 2) + "px",
            "top": (($winHeight - $contentOuterHeight) / 2) + "px"
        });
    }

    //クリック処理
    $("#modal-open").click(function(){
        modal.inner();
        player.playVideo();
    });
    $(window).resize(modal.resize);
});

aタグのリンク機能を無効にするために、こう書かないといけないかも
【HTML】

<div class="youtube">
  <a id="modal-open" href="javascript:;">
    <img src="youtube_thm.jpg" alt="サムネイル画像">
  </a>
</div>

CSSでモーダル部分の調整
【CSS】

#modal-content{
    width:80%;
    margin:0;
    padding:0;
    background:#fff;
    position:fixed;
    display:none ;
    z-index:99999;
}
#modal-content .inner{
    position:relative;
    width:100%;
    padding-top:56.25%;
    overflow:hidden;
}
#modal-content .inner #player{
    position:absolute;
    top:0;
    right:0;
    width:100%;
    height:100%;
}
#modal-overlay{
    z-index:9999;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:120%;
    background-color:rgba( 0,0,0, 0.75 );
}

DEMO

参考サイト

• 【レスポンシブ対応】YouTube Player iframe APIで動画をモーダル再生する方法