Fancybox video doesn't play after clicking a second time (error?)

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&byline=0&portrait=0&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