FancyBox Iframe doesn't close a second time

Question

I know this question has been asked before, but I can't get my code to work.

I have my fancybox running:

$(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 the popup, and then try to open it again, the video does not appear, can anyone help me resolve it, most of the solutions are of the type: "inline" and do not make seams for working with my example.

Thank you very much,

Answer 1

If you use fancybox v2.x, you do not need the (obsolete) parameters (v1.3.4) in your script. You could do

1). Install html as

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

... removing the fancybox.iframe special class

2). Add the js file of the help files, for example:

 <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 can add a few additional API options if you need them. Check out http://fancyapps.com/fancybox/#docs for v2.x options