Link 在 Fancybox 弹出窗口中

Question

我在加载页面时自动触发 Fancybox 弹出窗口。

在该弹出窗口中有一个 HTML 内容，link 到其他页面。

link 在加载 Fancybox 时不起作用。

这是我的代码：

<div class="popup">
  <div class="container">
    <h4>Description text...</h4>
    <a class="btn btn-green" href="/the_url_of_the_page">View more</a> //this link is not working
  </div>
</div>

  <script>
    $(document).ready(function() {
      $('.popup').fancybox({
        transitionEffect : "zoom-in-out",
      }).trigger('click');
    });
  </script>

如何设置 link 正常工作？

我正在使用 Fancybox v3.1.28

Answer 1

首先，links、按钮等在 fancybox 中工作得非常好。

您的示例中的问题是由于您使用 .popup 选择器来初始化 fancybox，但它匹配包含您的 link 的元素。所以，你的代码可以翻译成'start fancybox when user clicks on element having class ".popup"'。但是，您的 link 位于名称为“.popup”的 class 元素内部，因此它启动了 fancybox。

最后，你的代码没有任何意义。如果你想立即启动fancybox，那么使用$.fancybox.open()方法，示例见https://fancyapps.com/fancybox/3/docs/#api

Link 在 Fancybox 弹出窗口中

Link inside the Fancybox popup

javascript

fancybox