Magnific Popup: ошибка при попытке вызвать всплывающее окно iframe YouTube из встроенного всплывающего окна

Question

Я использую Magnific Popup для отображения встроенного модального изображения и некоторого текста. Теперь клиент хочет добавить ссылку внутри этот встроенный модальный просмотр видео - при этом видео находится внутри нового модального всплывающего окна.

Мы используем видеомодуль по всему сайту уже без каких-либо проблем, однако, когда ссылка находится внутри встроенного модального черного наложения, встроенный модал уходит, как ожидалось, но не появляется модальный мода.

<a class="modal-youtube" href="https://www.youtube.com/watch?v=5r15IUNWhl8">Watch a Video</a> 

В консоли имеет эту ошибку:

Error: Syntax error, unrecognized expression: https://www.youtube.com/watch?v=5r15IUNWhl8 

Для справки, вот мой код Javascript - это все довольно стандартный материал из документации, хотя.

$('.modal-youtube, .modal-vimeo, .modal-gmaps').magnificPopup({ 
    disableOn: 700, 
    type: 'iframe', 
    mainClass: 'mfp-fade', 
    removalDelay: 160, 
    preloader: false, 

    fixedContentPos: false 
}); 



$('.modal').magnificPopup({ 
     type: 'inline', 
     preloader: false, 
     showCloseBtn: true 
    }); 

Это звучит как Magnific Popup возникли проблемы Перестройка ссылку на YouTube, чтобы создать IFRAME, но я понятия не имею, почему это работает везде для внутри модального окна, за исключением. Есть идеи?

Answer 1

Я совершенно новый, чтобы увеличить изображение, и я испытываю одну и ту же проблему: мой youtube src не строит правильно. Я не запускаю всплывающее окно с тегом <a>, а скорее на <div>. Возможно, я не буду рассматривать вашу ситуацию, но вот моя обходная идея для вас. Я не сумасшедший, но это сработало.

// store the youtube url in a data- attribute as I build my page 
$(section_item).data("yt",thisLink); 

//section_item is my <div> where the magnific-popup spawns from 
$(section_item).magnificPopup({ 
     items:{ 
      src:$(section_item).data("yt") 
     }, 
     type:'iframe', 
     callbacks:{ 
      open:function({ 
       $("iframe").attr("src",$.magnificPopup.instance.currItem.src); 
      } 
     }, 
}); 

Я видел сломанный YouTube src:

file://www.youtube.com/embed/ttps://www.youtube.com/embed/-fuulLKmxxg?autoplay=1 

open обратного вызова, где я заставил src быть исправлена, где он срубил, вспоминая его от currItem.src:

https://www.youtube.com/embed/-fuulLKmxxg 

Я пробовал играть с объектом patterns, в documentation, но я не мог этого понять Работа. Надеюсь, это было немного полезно.