Question

I’m having some issues with a WordPress website I recently built. I have implemented Fancybox into the page which opens up with an iframe from Vimeo. It all seems to be working fine, except for when I click on the button to make the Fancybox pop up with the video. If I then close the Fancybox and open it up again, it just displays a white box, almost as if the video cannot load a second time.

Here is the HTML:

        <a href="#introVideoContent" class="mainBtn viewAllEventsBtn">Or view our complete range of Events</a>

    <div id="introVideo">
        <a href="#introVideoContent" class="various1">Click here to watch oa teaser video!</a>
    </div>

<div style="display: none;">
            <div id="introVideoContent" class="video-js-box">
                <iframe src="http://player.vimeo.com/video/31444322?title=0&amp;byline=0&amp;portrait=0&amp;color=ad221d" width="916" height="515" frameborder="0" webkitAllowFullScreen allowFullScreen></iframe>
            </div>
        </div>

…and the Fancybox jquery:

$(document).ready(function() {
    $(".various1").fancybox({
        'titlePosition'    : 'inside',
        'transitionIn'     : 'elastic',
        'transitionOut'    : 'elastic',
        'titleShow'        : false
    });
});

I’m using Fancybox 1.3.4 and the latest version of jQuery.

Really don’t know what’s going on here but I suspect it is something quite straight-forward. Any help would be greatly appreciated.

Thanks

Answer 1

There is a bug using inline iframes
You may edit the uncompressed version of fancybox js file (line 946)
see
http://groups.google.com/group/fancybox/browse_thread/thread/feec524b4c0199bc

or check for a workaround within your custom script
http://groups.google.com/group/fancybox/browse_thread/thread/1fd249d5f2bbd88e/
(check my post of Jun 6, 1:23PM)