将Fancybox 3打开到iframe父级中 [英] Open fancybox 3 into iframe parent

问题描述

这是我的问题: -我有一个iframe的fancybox 3画廊简介 -当我单击该链接之一时，我希望该图像显示在我的iframe的父项上方

Here is my problem : - i have an fancybox 3 gallery intro an iframe - when i click to one of the link, i would like the image showing on top of the parent of my iframe

我做了很多研究，并尝试了几种解决方案

I have made many researches and tried several solutions

我发现了这个问题:从iframe调用父级的Fancybox 但这仅为fancybox 2提供了解决方案

I found this : call Fancybox in parent from iframe but it only provide a solution for fancybox 2

这是我在iframe上的代码:

Here is my code on the iframe :

$(document).ready(function() {
    parent.$(".fancybox").fancybox({
        href:  this.href
    });
});

请注意

• 我在iframe和父级中都包含了jquery和fancybox 3

• i have included jquery and fancybox 3 both in the iframe and the parent

fancybox在iframe和父级中像一个超级按钮一样独立工作，但无法从iframe调用以显示在父级中(我的问题)

fancybox works like a charm independently in the iframe and the parent, but cannot be called from the iframe to be displayed in the parent (my problem)

我也尝试过:

$(.fancybox"，top.document).fancybox

$(".fancybox", top.document).fancybox

$(.fancybox"，window.opener.document).fancybox

$(".fancybox", window.opener.document).fancybox

$(.fancybox"，window.parent.document).fancybox

$(".fancybox", window.parent.document).fancybox

这些都不起作用

非常感谢您的关注

推荐答案

我希望您在进行许多研究"时对文档进行修改.从文档中:

I hope you red the docs while doing "many researches". From the docs:

要从父窗口内部访问和控制父窗口中的fancybox iframe:

To access and control fancybox in parent window from inside an iframe:

// Adjust iframe height according to the contents
parent.jQuery.fancybox.getInstance().update();

这应该给您一个提示，您可以使用parent.jQuery.fancybox在父页面上使用API​​.

This should give you a clue that you can use parent.jQuery.fancybox to use API from the parent page.

然后，API部分应为您提供以编程方式打开图片库的提示:

Then, API section should give you a clue how to open image gallery programmatically:

$.fancybox.open([
    {
        src  : '1_b.jpg',
        opts : {
            caption : 'First caption',
            thumb   : '1_s.jpg'
        }
    },
    {
        src  : '2_b.jpg',
        opts : {
            caption : 'Second caption',
            thumb   : '2_s.jpg'
        }
    }
], {
    loop : false
});

因此，将这两个代码段结合起来应该可以为您提供答案.

So, combining these two snippets should give you the answer.

这篇关于将Fancybox 3打开到iframe父级中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！