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('');
}
}
});
yuru
まさに案件でこれを実装せねばならず、途方に暮れてダメ元でネットサーフィンしてこちらに行き着き、解決しました。
本当にありがとうございます。
一言お礼を申し上げたく、コメントさせていただきました。