fancyboxfancybox-2

How to access an element inside the iframe in aferShow event?


I am using Fancybox 2.1.4. I would like to access the element inside the iframe in the afterShow event.

        $('.fancybox').fancybox({
            type: 'iframe',
            afterShow: function() {

                 //need to access element #mydiv

            }
            iframe: {
                preload: true 
            }
        });

How can I do that? Does preload: true and preload: false has any effect on accessing the element? Suppose that the parent window and the iframe access the pages on the same website.


Solution

  • This is how you can access iframe and, for example, bind custom load event if using v3:

    $("[data-fancybox]").fancybox({
      iframe : {
        preload: false
      },
      afterLoad : function(instance, slide) {
        slide.$slide.find('iframe').on('load', function() {
          alert('done');
        });
      }
    });
    

    https://codepen.io/anon/pen/yXwoNM?editors=1010