Overlays / Popups / Modals
Video
Examples from different third-party services like Youtube, Vimeo and direct source.
You have to add attribute data-mp-video to target element.
Video popup - Youtube
<a href="https://www.youtube.com/watch?v=JtA8gqWA6PE" class="button" data-mp-video><span>Video popup - Youtube</span></a>Video popup - Vimeo<a href="https://vimeo.com/253989945" class="button" data-mp-video><span>Video popup - Vimeo</span></a>Video popup - Direct source<a href="http://techslides.com/demos/sample-videos/small.mp4" class="button" data-mp-video><span>Video popup - Direct source</span></a>Images Single & Gallery
Some examples to show how single image and gallery image popup works.
You have to add attribute data-mp to target element.
Single image
<a href="images/content/overlay-1.jpg" title="Quam enim, lorem consectetur sed. Risus, nullam felis enim feugiat pellentesque." class="button" data-mp><span>Single image</span></a>
<div data-mp-gallery>
<a href="#" title="Quam enim, lorem consectetur sed. Risus, nullam felis enim feugiat pellentesque." class="button"><span>Gallery image 1</span></a>
<a href="#" title="Quam enim, lorem consectetur sed. Risus, nullam felis enim feugiat pellentesque." class="button"><span>Gallery image 2</span></a>
<a href="#" title="Quam enim, lorem consectetur sed. Risus, nullam felis enim feugiat pellentesque." class="button"><span>Gallery image 3</span></a>
</div>