MagnificPopupでYoutubeを指定時間から再生する方法

MagnificPopupでYoutubeを指定時間から再生する方法

コールバック関数のiframeのpatternsで引っ掛けてコールバック関数で分解してURL(src)を生成しました。無理矢理なのでもっとスマートにできるはず。><


$('.popup-media').magnificPopup({
    type: 'iframe',
    mainClass: 'mfp-fade',
    removalDelay: 200,
    preloader: false,
    iframe: {
        patterns: {
            youtube: {
                index: 'youtube.com/', // String that detects type of video (in this case YouTube). Simply via url.indexOf(index).
                id: function(url){
                    var url = 'v='+url.split('v=')[1],
                        pair= url.split('&')
                        ,arg = {}
                        ,ret = '';

                    for(var i=0;pair[i];i++) {
                        var kv = pair[i].split('=');
                        arg[kv[0]]=kv[1];
                    }
                    ret = arg['v'] + '/?autoplay=1';
                    if(typeof arg['t'] !== 'undefined'){
                        ret += '&start='+ arg['t'].replace('s','');
                        }
                        return ret;
                },
                src: '//www.youtube.com/embed/%id%' // URL that will be set as a source for iframe.
            },
        }
    },
    callbacks: {
        open: function () {
            $('.mfp-close').html('');
        }
    }
});

古いAndroidの標準ブラウザへの簡単な対応

nginxでのワードプレスのパーマリンク設定

1件のコメント

  1. yuru

    まさに案件でこれを実装せねばならず、途方に暮れてダメ元でネットサーフィンしてこちらに行き着き、解決しました。
    本当にありがとうございます。

    一言お礼を申し上げたく、コメントさせていただきました。

yuru へ返信する コメントをキャンセル

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


Powered by WordPress & Theme by Anders Norén