在移动设备上关闭 Fancybox 3答案

【问题标题】：Closing Fancybox 3 on a mobile device在移动设备上关闭 Fancybox 3
【发布时间】：2018-02-24 11:01:37
【问题描述】：

在桌面上使用fancybox，当在内容之外单击时它会关闭。在移动设备上使用它，它仅在内容向上或向下滑动时关闭（它不会对点击内容外部做出反应）。

是否可以（以及如何）通过点击内容外部来关闭移动设备上的fancybox？

【问题讨论】：

【解决方案1】：

fancyBox 对移动设备有不同的“点击事件”，您可以使用“移动”选项自定义它们，例如：

mobile : {
    clickContent : "close",
    clickSlide : "close"
}

【讨论】：

谢谢，成功了！不知何故，我没有完全理解这些选项 - 我认为 clickOutside 应该已经足够了......
我们生活在一个真正幸福的时代...我在 Google 上搜索“fancybox close on click outside mobile”并在 10 秒内解决了我的问题。
2020 年 6 月对我有用，但我有这个延迟 - 图像不会立即关闭（大约等待一秒钟）......知道吗？

【解决方案2】：

这个例子试试看：

$('[data-fancybox]').fancybox({
  clickContent : function( current, event ) {
    return current.type === 'image' ? 'zoom' : 'close';
  }
});

这个链接试试看： https://codepen.io/anon/pen/WEKmoB

【讨论】：

有趣...谢谢。您的示例（您的链接）完美运行，而我的演示却没有：mikasbinkis.lt/xp。你能给我一些关于我做错了什么的提示吗？
嗯.... 很抱歉打扰您，但您是否提供了链接？因为我看不到一个......

【解决方案3】：

这是使用 Fancybox 3.5.7 修改移动部分中原始源代码的移动部分的解决方案：

mobile: {
                preventCaptionOverlap: !1,
                idleTime: !1,
                clickContent: function (t, e) {
                    return "image" === t.type && "close";
                },
                clickSlide: function (t, e) {
                    return "image" === t.type && "close";
                },

有人问及上述延迟。延迟发生在单击以了解是否会有双击。需要时间来查看是否有另一次点击，如果没有，则图像关闭。因此，如果您（如我的示例中）删除双击功能（dblclickContent 和 dblclickSlide），这将消除延迟问题。

【讨论】：