如何在 Fancybox 4 中切换缩略图条的可见性？

Question

来自指南

You can check current state of Thumbnail plugin and toggle visibility of thumbnail strip using API:

Fancybox.getInstance().plugins.Thumbs.state;

Fancybox.getInstance().plugins.Thumbs.toggle();

因为它在打开时会自动显示缩略图，所以我用这种方式来禁用缩略图条的可见性

        ...
        <script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui@4.0/dist/fancybox.umd.js"></script>
        <script>
            $(document).ready(function(){
                Fancybox.getInstance().plugins.Thumbs.toggle();
            
            });
        </script>
    </body>
</html>

但是没有用，怎么用呢？

Answer 1

这段代码片段：

Fancybox.getInstance()

允许您获取对最活跃实例的引用。这意味着您的代码将无法运行，因为您还没有启动 Fancybox。

要在开始时切换可见性，只需使用 autoStart 选项，如下所示：

Fancybox.bind("[data-fancybox]", {
  Thumbs: {
    autoStart: false,
  },
});

如何在 Fancybox 4 中切换缩略图条的可见性？

How to toggle visibility of thumbnail strip in Fancybox 4?

javascript

fancybox