如何在YouTube弹出窗口中嵌入YouTubevideo？
我有一个很棒的弹出插件。但它没有在弹出窗口上显示video如何在巨大的弹出窗口中嵌入YouTubevideo？
请查看以下链接以获取文档：
文件
$(document).ready(function() { $('.popup-youtube, .popup-vimeo, .popup-gmaps').magnificPopup({ disableOn: 700, type: 'iframe', mainClass: 'mfp-fade', removalDelay: 160, preloader: false, fixedContentPos: false }); }); Open YouTube video 希望这可以帮助。
默认情况下，Magnific Popup仅支持每种服务的一种URL，因此我将其扩展为支持几乎所有videoURL类型的YouTube / Vimeo：
http://dimsemenov.com/plugins/magnific-popup/documentation.html#iframe-type
$('.my-selector').magnificPopup({ type: 'iframe', iframe: { patterns: { youtube: { index: 'youtube.com/', id: function(url) { var m = url.match(/[\\?\\&]v=([^\\?\\&]+)/); if ( !m || !m[1] ) return null; return m[1]; }, src: '//www.youtube.com/embed/%id%?autoplay=1' }, vimeo: { index: 'vimeo.com/', id: function(url) { var m = url.match(/(https?:\/\/)?(www.)?(player.)?vimeo.com\/([az]*\/)*([0-9]{6,11})[?]?.*/); if ( !m || !m[5] ) return null; return m[5]; }, src: '//player.vimeo.com/video/%id%?autoplay=1' } } } });
只需复制这两个属性（ iframe ， type ）并将它们添加到Magnific Popup即可。
优秀的起点罗伊，但让我们进一步扩展这一点，因为Youtube从特定的时间嵌入开始，现在给用户youtu.be链接嵌入。 因此，为了匹配包括从特定时间线开始video的两种情况，我这样做。 请注意，我还添加了标记覆盖，如果您不需要它，请将其删除。
function extendMagnificIframe(){ var $start = 0; var $iframe = { markup: '' + '' + '' + '' + '', patterns: { youtube: { index: 'youtu', id: function(url) { var m = url.match( /^.*(?:youtu.be\/|v\/|e\/|u\/\w+\/|embed\/|v=)([^#\&\?]*).*/ ); if ( !m || !m[1] ) return null; if(url.indexOf('t=') != - 1){ var $split = url.split('t='); var hms = $split[1].replace('h',':').replace('m',':').replace('s',''); var a = hms.split(':'); if (a.length == 1){ $start = a[0]; } else if (a.length == 2){ $start = (+a[0]) * 60 + (+a[1]); } else if (a.length == 3){ $start = (+a[0]) * 60 * 60 + (+a[1]) * 60 + (+a[2]); } } var suffix = '?autoplay=1'; if( $start > 0 ){ suffix = '?start=' + $start + '&autoplay=1'; } return m[1] + suffix; }, src: '//www.youtube.com/embed/%id%' }, vimeo: { index: 'vimeo.com/', id: function(url) { var m = url.match(/(https?:\/\/)?(www.)?(player.)?vimeo.com\/([az]*\/)*([0-9]{6,11})[?]?.*/); if ( !m || !m[5] ) return null; return m[5]; }, src: '//player.vimeo.com/video/%id%?autoplay=1' } } }; return $iframe; } $('.my-selector').magnificPopup({ type: 'iframe', iframe: extendMagnificIframe() });