Fancybox-嵌入式YouTube(使用YouTube API）没有't在iOS上加载

我正在使用Fancybox来显示上传到YouTube的视频。我想在视频结束时执行操作（在这种情况下，从视频移动到组中的下一个元素-图像），所以我也在使用YouTube API。

这个页面在桌面浏览器上运行得很好（我认为是安卓系统，但我还没有广泛测试过），但在我的iPhone上，它无法加载视频。覆盖正在出现，但它似乎试图自动播放视频，然后变成黑色。

我目前正在使用jQuery 1.8.3（我用1.10尝试过，但没有成功，所以我尝试了降级）和Fancybox 2.1.5。

以下是相关的HTML:

<div class="content" id="main">
    <div id="logo">
        <a class="fancybox fancybox.iframe" id="logo-link" data-fancybox-group="group01"href="http://www.youtube.com/embed/Bc0qNwaSxlM"></a>
        <a class="fancybox" id="v-link" data-fancybox-group="group01" data-fancybox-type="image" href="img/superhard_v.png" title="<a href='#' id='return-link'>or return to ihardyou</a>"></a>
    </div>
</div>

JavaScript:

window.onYouTubePlayerAPIReady = function() {
    // Initialise the fancyBox after the DOM is loaded
    $(document).ready(function() {
        $(".fancybox")
            .attr('rel', 'gallery')
            .fancybox({
                helpers: {
                    media: {},
                    overlay : {
                        css : {
                            'background' : 'rgba(0, 0, 0, 0.95)'
                        }
                    }
                },
                youtube : {
                    vq: 'hd1080'
                },
                padding: 0,
                margin: 30,
                autoSize: false,
                arrows: false,
                'closeBtn' : false,
                beforeShow  : function() {
                    // Find the iframe ID
                    var id = $.fancybox.inner.find('iframe').attr('id');
                    // Create video player object and add event listeners
                    var player = new YT.Player(id, {
                        events: {
                            'onReady': onPlayerReady,
                            'onStateChange': onPlayerStateChange
                        }
                    });
                    if (this.index === 1) {
                        $('.fancybox-outer').css("padding-bottom","100px");
                    }  
                },
                afterShow: function() {
                    if (this.index === 1) {
                        $("img.fancybox-image").click(function(event) {
                            event.preventDefault();
                            newLocation = "vanity/";
                            $('body').fadeOut(1000, newPage);
                        });
                        $('#return-link').click(function(event) {
                            event.preventDefault();
                            $.fancybox.close();
                        });  
                    }               
                },
                tpl: {
                    wrap : '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin" style="background-color:transparent;"><div class="fancybox-outer"><div class="fancybox-inner"></div></div></div></div>'
                },
                iframe: {
                    preload: false
                }
            });
    });
}
function onPlayerReady(event) {
    event.target.playVideo();
}
// Fires when the player's state changes.
function onPlayerStateChange(event) {
    // Go to the image after the current one is finished playing
    if (event.data === 0) {
        setTimeout(function(){$.fancybox.next()},1250);
    }
}

我为iframe输入了autoSize和preload: false，因为我遇到了其他人的问题，但它们不起作用。由于这个问题和JSFiddle的例子，我特别希望后者能起作用，但它没有起作用，这让我相信这可能是API的问题？我还在Fancybox主页上查看了使用API的示例，但它在我的iPhone上也不起作用，这进一步证实了我的怀疑。

如果有人有解决方法或任何解决方法，我们将不胜感激。谢谢