YoutubeのURLだけでその場で動画再生できるようにする

Ads

Result

jQuery

//URLの含まれるDOMをセレクタに指定
$('p').html(function(i, html) {
    //正規表現でドメインを探して動画のID取得→変数に。
    var re  = /(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g,
        //動画再生タグに置換
        vid = '<iframe width="420" height="345" src="http://www.youtube.com/embed/$1" frameborder="0" allowfullscreen></iframe>';
    return html.replace(re, vid);
});

css

iframe[src*="http://www.youtube.com/embed/"] {
    display:block;
    margin:0px auto 10px;
    border:2px solid black;
}

via

via:http://hompimpaalaihumgambreng.blogspot.jp/2012/04/convert-youtube-url-into-video.html