用fancybox打破iframe

Question

我有一个带有iframe的页面，在iframe页面上我有一个img打开了一个fancybox。这很好用，只是模态框的目标是iframe，只给整个页面的一部分一个黑色叠加，并将fancybox置于iframe的中心而不是整个页面。

这是代码：

<img src="/img/icons/calendar.png" class="fancybox" id="fancyCalendar" />

<script>
    $j('#fancyCalendar').click(function() {
        $j.fancybox.open({
            href: 'calendar.html',
            type: 'iframe',
            padding: 5,
            width: 880,
            height: 335
        });
    });
</script>

我尝试过这些东西，没有用过：

• 将目标添加到img
• 使img成为与目标的链接
• 将window.parent预先添加到fancybox.open prepending
• window.parent.parent到fancybox.open

我不知道我还能尝试什么，有人知道怎么做吗？

Answer 1

iframe是另一个浏览器中的浏览器独立窗口，因此您无法执行您要执行的操作。

唯一的解决方法是，如果iframe与顶部框架在同一个域中，那么仅是调用父框架的fancybox函数。

在iframe中调用：

window.parent.openFancyBox(url, params...);

在父中，您拥有本地功能

function openFancyBox(url, ....) {
    ...
}

Answer 2

您首先在iframe中加载内容，然后使用插件fancybox打开它。