Search code examples
jqueryiosipadfancybox-2vimeo

Vimeo In Fancybox 2 On iPad

I have Fancybox 2 setup on this page: http://discoverycolorado.dreamhosters.com/ (featured videos) and everything works fine except on an iPad. It seems as though the video is below the grey overlay and thus, I can't play the video on an ipad.

Here are my Fancybox settings: 

$(document).ready(function() {
$('.videoLightbox').fancybox({
    openEffect  : 'fade',
    closeEffect : 'fade',
    aspectRadio : true,
    autoDimensions : true,
    fitToView   : true,
    autoResize  : true,
    autoScale   : true,
    width       : 960,
    height      : 540,
    padding     : 0,
    type        : 'iframe',
    helpers   : {
        media : {},
        title : null,
        overlay: {
            opacity: 0.9
        } // overlay 
    }
});
});

Any ideas why this is happening?

Solution

  • The problem was solved by changing the z-index of an overlying div I didn't see. Works fine now.