如何强制fancybox显示在index.html而不是iframe中

Question

我一直在寻找如何做到这一点的年龄，无论我找到多少答案和演示，它都不适合我。

我在iframe中有一堆缩略图，当我点击那些fancybox时，只会出现在iframe中。我试图强制fancybox来到iframe之外以显示更大的图像而不是iframe内部但是每次尝试都会导致图像在iframe内被炸成全尺寸。

我在iframe和index.html中都有源码和css，我使用的是fancybox版本2.1.5，这就是我在两个标题中都有的...：

    <link rel="stylesheet" type="text/css" href="/fancybox/source/jquery.fancybox.css" />
    <script type="text/javascript" src="/fancybox/source/jquery.js"></script>
    <script type="text/javascript" src="/fancybox/source/jquery.fancybox.js"></script>
    <script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js"></script>

...这就是我在iframe中所拥有的：

    $('.fancybox').ready(function() {
        parent.$.fancybox();
        $("a[href$='.jpg']").attr('rel', 'gallery').fancybox();
    });

即使是现在它也忽略了父母。部分并继续在iframe中显示fancybox。如果我将.ready更改为.click，那么整个图像会在iframe中爆炸成全尺寸。