image in magnific popup in iframe

Question

i have a magnific popup being displayed dynamically but the image is rendered after the load event so i cannot get the value of the image in the open event. is there any onload event in magnific popup?

 function OpenPopup(el) {
            var temp = el.innerHTML;
            var mysrc = $(temp).attr("src");
            var isobj = $.magnificPopup.open({
                items: {
                    src: mysrc,
                    onload: 'myevent()',
                },
                type: 'iframe',
                closeOnBgClick: false,
                markup: '<div class="mfp-iframe-scaler">' +
                 '<div class="mfp-close"></div>' +
                 '<iframe class="mfp-iframe" frameborder="0" onload="myevent()"></iframe>' +
                 '<div class="mfp-bottom-bar">' +
                   '<div class="mfp-title"></div>' +
                 '</div>' +
               '</div>',
                callbacks: {
                    beforeOpen: function () {
                        console.log('Start of popup initialization');
                    },
                    elementParse: function (item) {
                        // Function will fire for each target element
                        // "item.el" is a target DOM element (if present)
                        // "item.src" is a source that you may modify
                        debugger;
                        console.log('Parsing content. Item object that is being parsed:', item);
                    },
                    change: function () {
                        console.log('Content changed');
                        console.log(this.content); // Direct reference to your popup element
                    },
                    resize: function () {
                        console.log('Popup resized');
                        // resize event triggers only when height is changed or layout forced
                    },
                    open: function () {
                        console.log('Popup is opened');
                        debugger;
                        var iframe = $.magnificPopup.instance,
          t = $(iframe.currItem.el[0]);
                        var contents = iframe.contents();
                        $(contents).css('max-width', '100%');
                        $(contents).css('max-height', '100%');
                    }
                }
            });

Answer 1

Not a proper solution put i added a timed event which resizes the image once it is loaded. Had to play a lot to get the perfect time so that there is no glitch. Here is the code:

function OpenPopup(el) {
            var temp = el.innerHTML;
            var mysrc = $(temp).attr("src");
            var isobj = $.magnificPopup.open({
                items: {
                    src: mysrc,
                },
                delegate: 'a',
                type: 'iframe',
                closeOnBgClick: false,
            });
            setTimeout(setImage, 500);
        };
function setImage() {
            var iframe = $('.mfp-iframe');
            var contents = iframe.contents();
            $(contents).find('img').attr('width', '100%');
            $(contents).find('img').attr('height', '100%');
        }