FancyBox Iframe not closing second time

问题:

I know this question was asked before however I cannot get my code to work.

I have my fancybox initiated:

$(document).ready(function() {

            $('.fancybox').on('click', function(event) {
    event.preventDefault();
    $.fancybox({
        'type' : 'iframe',
        // hide the related video suggestions and autoplay the video
        'href' : this.href = this.href.replace(new RegExp("([0-9])","i"),'moogaloop.swf?clip_id=$1') + '&autoplay=1',
        'overlayShow' : true,
        'centerOnScroll' : true,
        'speedIn' : 100,
        'speedOut' : 50,
        'width' : 640,
        'height' : 480
    });
});

});

and then iframe is called:

<a class="fancybox fancybox.iframe" href="http://vimeo.com/123456">

But when I close popup and then try to open that again video is not showing up, could anyone help me to resolve it, most of solutions relates to 'type' : 'inline' and doesnt seams to work with my example.

Many thanks,

回答1:

If you are using fancybox v2.x, then you don't need the (obsolete) options (v1.3.4) in your script. You could rather do

1). Set your html like

<a class="fancybox" href="http://vimeo.com/123456">

... removing the special class fancybox.iframe

2). Add the helpers media js file like :

<script type="text/javascript" src="../helpers/jquery.fancybox-media.js"></script>

... set your path accordingly

3). use this script

jQuery(document).ready(function ($) {
    $('.fancybox').fancybox({
        helpers: {
            media: {}
        }
    });
});

... and save yourself some headaches.

See JSFIDDLE

You could add some more API options if you need them. Check http://fancyapps.com/fancybox/#docs for the options of v2.x