Question

美好的一天。

我遇到了这样的问题：当打开fancyBox图库时，我只需点击打开的图像（幻灯片），图像就会缩放。我需要禁用这种行为。

在文档中，建议使用clickContent事件来自定义行为。我从文档中获取示例并通过下一个方式初始化我的库副本：

$("[data-fancybox]").fancybox({
    clickContent : function( current, event ) {
        // return current.type === 'image' ? 'zoom' : false;
        if (current.type === 'image') {
            return false;
        }
    },
    slideShow: false,
    fullScreen: false,
    thumbs: false
});

但clickContent覆盖不起作用。我尝试了console.log() clickContent事件：

$("[data-fancybox]").fancybox({
    clickContent : function( current, event ) {
        // return current.type === 'image' ? 'zoom' : false;
        console.log('clicking test!');
    },
    slideShow: false,
    fullScreen: false,
    thumbs: false
});

但我没有成功。

也许我在某个地方犯了错误。请指正。提前谢谢！

Answer 1

更新到v3.1并使用"close" - close instance "next" - move to next gallery item "nextOrClose" - move to next gallery item or close if gallery has only one item "toggleControls" - show/hide controls "zoom" - zoom image (if loaded successfully) false - do nothing选项选择用户点击内容时的操作。可能的值：

clickContent : function( current, event ) {
  return current.type === 'image' ? 'zoom' : false;
}

它也可以是从列表中返回值的函数。默认值：

{{1}}

此外，您的代码段正常 - https://codepen.io/anon/pen/GvNdJE

fancyBox3 - 如何在单击打开的图像时禁用缩放

1 个答案: