用fancybox打破iframe

时间:2014-02-28 13:25:33

标签: javascript jquery iframe fancybox

我有一个带有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

我不知道我还能尝试什么,有人知道怎么做吗?

2 个答案:

答案 0 :(得分:0)

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

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

在iframe中调用:

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

中,您拥有本地功能

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

答案 1 :(得分:-2)

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