6

I would like to use magnifico-popup to display a locally hosted mp4 file.

Do I need to define an iframe pattern for this or is there a simpler option.

Many thanks for your thoughts

Anita

Dmitry Semenov
  • 4,566
  • 2
  • 36
  • 39
Anita Graham
  • 456
  • 1
  • 5
  • 13

3 Answers3

10

You'll need to integrate some third-party video player, for example http://mediaelementjs.com/

I'd recommend to use inline type of popup, as it allows you to open in popup any HTML code. http://dimsemenov.com/plugins/magnific-popup/documentation.html#inline-type

Related example: http://codepen.io/dimsemenov/pen/GtjBb

Dmitry Semenov
  • 4,566
  • 2
  • 36
  • 39
  • 1
    Thanks Dmitry for your answer, I struggled a couple of hours with your solution, I will suggest that they call the mediaelement plugin inside the open() callback of Magnific popup to make it work without problems. – Adan Archila Mar 23 '15 at 07:32
  • @AdanArchila Tried initializing MediaElement with callbacks: { open: function() {} } - not working. Can you share your code? That would be great. Thanks! – Ihor Vorotnov Jul 16 '15 at 22:17
  • @Ihor-paspar2.com I can't paste code here in the comments, so I just forked Dmitry codepen and modified the callbacks, please only check the javascript is not a working example, I just wanted to paste my javascript http://codepen.io/adan/pen/gpjwVw – Adan Archila Jul 17 '15 at 03:59
  • @AdanArchila thanks for the code, it shreds some light on proper js code. Another question - your .open-popup-link which opens Magnific, is it linked to mp4? What is passed to Magnific as inline content - just the url or full tag? – Ihor Vorotnov Jul 17 '15 at 19:13
  • In my project I passed the ID of a div, this div looks something like this:
    – Adan Archila Jul 18 '15 at 05:12
5

You can use the type of content - iframe to open MP4 video:

<a class="mfp-iframe" href="MP4_VIDEO_PATH">Open MP4 video in iframe</a>
Sky Yip
  • 1,059
  • 12
  • 10
0

I'm going to add a comment here in response to Sky Yip because that solutions works beautifully EXCEPT that it doesn't work in Safari which is obviously a problem. More details here: https://github.com/dimsemenov/Magnific-Popup/issues/1149

Joel Newcomer
  • 51
  • 1