Вставить видео vimeo с помощью magnific popup

Я программирую сайт с Bootstrap и семейным/лесным шаблоном на одну страницу (на themeforest.net), я настроил раздел портфолио этого шаблона, чтобы иметь всплывающее окно при нажатии на миниатюру (вместо первоначального всплывающего окна).Вставить видео vimeo с помощью magnific popup

Всплывающее прекрасно работает с классом «мфу-IFrame» и «видео/video_name.mp4» HREF, так вот код:

Я не хочу использовать в mp4 видео, но с Vimeo видео и ы не работает, когда я заменить HREF «видео/video_name.mp4» по ссылке Vimeo «https://vimeo.com/118901221» или Vimeo ссылку вставлять «https://player.vimeo.com/video/118901221»

Пожалуйста, кто может помочь решить эту проблему.

источник

2016-05-01 Jah Mik

Вы прочитали документы на странице создателей? http://dimsemenov.com/plugins/magnific-popup/documentation.html – mlegg

да, конечно, я хорошо проверил раздел «iframe type», который посвящен видео vimeo, но я не понимаю, как включать javscript-шаблоны в код html для настройки видео src. Я успешно использовал mp4-видео с классом «mfp-iframe», но как использовать видео vimeo? –

Вам необходимо предоставить ссылку на номер. В случае vimeo это доступно, только если вы заплатили за премиум-аккаунт. Решением было бы повторно загрузить видео на YouTube, а затем получить прямую ссылку, выполнив следующие действия:

Скопируйте полный URL-адрес видео на YouTube.
Установите VLC Media Player и откройте его.
Hit Media (меню) ... и Open Network Stream.
Вставьте свой URL-адрес видео и нажмите «Воспроизвести».
Хит-инструменты (меню) ... Информация для СМИ. Здесь вы найдете прямой URL-адрес видео. Используйте это на своем веб-сайте.

Если вы хотите на самом деле вставлять из YT или Vimeo, проверить это:

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

     fixedContentPos: false 
    }); 
}); 

<a class="popup-youtube" href="http://www.youtube.com/watch?v=0O2aH4XLbto">Open YouTube video</a>

С documentation. И this question.

источник

2016-05-01 13:20:24

спасибо, да, я могу легко получить видеоролик, но проблема заключается в том, как включить встраивание видео vimeo или youtube внутри масштабного всплывающего окна? –

перенаправляется на www.youtube.com/watch?v=0O2aH4XLbto и не появляется во всплывающем окне –

, где я должен вставить этот код точно? $ (document) .ready (function() { $ ('. popup-youtube, .popup-vimeo, .popup-gmaps'). magnificPopup ({ disableOn: 700, Тип: 'iframe', mainClass: 'мфу фейдерными', removalDelay: 160, подгрузчик: ложь, fixedContentPos: ложные }); }); –

Вам понадобятся следующие коды ниже и попытайтесь проанализировать мою проблему о Vimeo в последний раз MAGNIFIC-POPUP: Embed videos from Vimeo on my site using magnefic popup. Если когда-нибудь вы столкнетесь с моей проблемой в Vimeo.

<!DOCTYPE html> 
    <html> 

    <head> 
     <title></title> 
     <!-- Bootstrap CSS --> 
     <link rel="stylesheet" href="css/bootstrap.min.css"> 
     <!-- Fontawesome --> 
     <link rel="stylesheet" href="css/font-awesome.min.css"> 
     <!-- Magnific Popup CSS--> 
     <link rel="stylesheet" type="text/css" href="css/magnific-popup.css"> 
    </head> 

    <body> 


     <a class="vimeo-video-1" href="#">CLICK ME TO POP-UP 1 VIDEP</a><br> 

     <a class="vimeo-video-more" href="#">CLICK ME TO POP-UP MORE VIDEO</a> 

     <!--Jquery --> 
     <script src="js/jquery.js"></script> 
     <!-- Bootstrap JS --> 
     <script src="js/bootstrap.min.js"></script> 
     <!-- Magnific Popup JS --> 
     <script src="js/jquery.magnific-popup.min.js"></script> 
     <script src="js/magnific-popup-options.js"></script> 
    </body> 

    </html> 

    <script type="text/javascript"> 
     $('.vimeo-video-1').magnificPopup({ 
      items: [ 
      { 
       src: 'https://player.vimeo.com/video/118901221', 
       type: 'iframe' // this overrides default type 
      }], 
      gallery: { 
       enabled: false 
      }, 
      type: 'image' 
     }); 

     //MORE VIMEO VIDEO 
     $('.vimeo-video-more').magnificPopup({ 
      items: [ 
      { 
       src: 'https://player.vimeo.com/video/118901221', 
       type: 'iframe' // this overrides default type 
      }, 
      { 
       src: 'https://player.vimeo.com/video/211690338', 
       type: 'iframe' // this overrides default type 
      },], 
      gallery: { 
       enabled: true 
      }, 
      type: 'image' 
     }); 
    </script>

источник

2017-04-08 03:13:56 Ace

Вставить видео vimeo с помощью magnific popup

ответ

Смежные вопросы