javascriptjquerymagnific-popup

Adding some text below the video popup


I want to add some text below the my video popup, like the example picture:

https://i.sstatic.net/eiiOW.png

How can I do that?

My code:

$(document).ready(function () {
    $.magnificPopup.open({
        items:[
            {
                src: 'http://www.youtube.com/watch?v=p_I70TYm9qQ',
                type:'iframe'
            },
        ],
        type: 'iframe'
    });
});

Solution

  • By default caption works only with image type.

    To make it work with iframe type, you'll need to add element that will hold title to iframe markup and parse it in markupParse callback, e.g.:

    callbacks: {
      markupParse: function(template, values, item) {
       values.title = item.el.attr('title'); // will use title attribute of target DOM element
      }
    }
    

    Here is example http://codepen.io/dimsemenov/pen/zjtbr