繁体   English   中英

Fancybox 3:单击图像时禁用缩放

[英]Fancybox 3: Disable zoom when image is clicked

我使用 Kirby CMS ( https://getkirby.com/ ) 中的 Fancybox 3 插件 ( http://fancyapps.com/fancybox/3/docs/ ) 设置了一个简单的图像滑块。 我唯一无法解决的问题是如何在滑块打开时单击图像时阻止滑块放大图像。

有人可以帮我解决这个问题吗?

我尝试在滑块的选项中包含clickSlide : 'close', ,但它不起作用。

以下是我在我的网站上为滑块全局设置的选项:

  <!-- Setting fancybox-options GLOBALLY -->

    <script type="text/javascript">

       $("[data-fancybox]").fancybox({

         thumbs          : false,

         hash            : false,

         loop            : true,

         keyboard        : true,

         toolbar         : false,

         animationEffect : false,

         arrows          : true,

       });

    </script>

  <!-- /////////////////////// -->

只需使用clickContent选项:

$("[data-fancybox]").fancybox({
  thumbs          : false,
  hash            : false,
  loop            : true,
  keyboard        : true,
  toolbar         : false,
  animationEffect : false,
  arrows          : true,
  clickContent    : false
});

演示 - https://codepen.io/anon/pen/XaabLJ?editors=1010

clickSlide选项用于在内容外部但在幻灯片内部的点击。 并且由于滑动的父母可以(在这个例子等-被调整大小https://codepen.io/fancyapps/pen/ZKqaKO ), clickOutside选项当滑动外点击时。

要禁用单击以滚动并从工具栏中删除缩放按钮:

$('[data-fancybox]').fancybox({
  clickContent: 'close',
  buttons: ['close']
})

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM