javascript - fancybox 内的 Fancybox(或嵌套的 fancybox)

Question

我有三个 html 页面，index.html、first.html 和 second.html。在索引页中，我有一个按钮 B1。当我单击该按钮时，会打开一个精美的框，其中包含 first.html 的内容。在 fancybox 内部，使用了另一个按钮 B2。单击 B2 时，第二个 fancybox 打开。第二个花式框在第一个花式框内，第二个花式框的内容是 second.html。问题是第二个 fancybox 的大小限制了第一个 fancybox 的内部。我怎样才能增加第二个花式盒的宽度和高度而不是第一个花式盒的宽度和高度？以下是代码。

$(".fancybox").click(function () {
        var url = $(this).attr('url');
        $.fancybox.open({
            href: url,
            type: 'iframe',
            padding: 1,
            autoDimensions: true,
            autoScale: false,
        });
    });

我尝试设置宽度和高度但没有成功。

Answer 1

根据documentation如果将“autoDimensions”设置为 true，则宽度和高度参数将被忽略。

您是否尝试过将“ margin ”设置为 0？它将删除框和视口(viewport)之间的空间。

看看这个例子: http://codepen.io/thiagofelix/pen/MYjNKE

$(document).ready(function () {
  $.fancybox({
    href: 'http://i.imgur.com/u0FXwTf.jpg',
    link: 'http://www.google.com.br',
    margin: 0,
    padding: 0,
    showCloseButton: false
  });
});