当前位置: 首页 > 知识库问答 >
问题:

Fancybox库中断刷屏

符学
2023-03-14

Fancybox破坏Swiper。在没有可见CSS和DOM更改的情况下添加偏移量。要在jsbin(https://output.jsbin.com/jiqucacete)上复制此问题,您需要:

new Swiper('.swiper-container', {
  slidesPerView: 1
});

1)按下swiper幻灯片图像2)转到fancybox图库弹出的下一个图像3)关闭图库,在swiper中将有幻灯片变化

它是如何工作的?为什么没有可见的CSS、DOM更改?如何修复?

共有1个答案

海嘉赐
2023-03-14

fancybox在关闭图库后会将焦点重新放在触发器元素上,有时carousel/slider脚本对此特性很敏感。要禁用该功能,请设置backfocus:false,例如:

$.fancybox.defaults.backFocus = false;
 类似资料:
  • FancyBox是一款基于jquery开发的类Lightbox插件。支持对放大的图片添加阴影效果,对于一组相关的图片添加导航操作按纽,该lightbox除了能够展示图片之外,还可以展示iframed内容, 通过css自定义外观。 相对与Lightbox而言,阴影效果更好。但是比Lightbox绚丽。 使用很是简单,可以参照Lightbox,修改添加代码。 示例代码: $(document).rea

  • 我看了十几篇文章和答案...都没用。 这个简单的代码有什么问题,我在这里错过了什么。尝试过的回调都不起作用。 和html 注:本地wamp 编辑:也在远程服务器上测试-剥离文件以防止任何交互-相同的结果

  • 问题内容: 如何在fancybox中上传新的html? 问题答案: 该文档就在网站上,您可以使用iframe: HTML

  • 问题内容: 我有2个页面,分别是index.html和social.html。我清理了索引,只剩下了需要fancybox的jquery代码。我想要做的是在social.html中包含图像,当单击它时,它将打开fancybox并显示它,但是在index.html中而不是在iframe中。出现的错误是: 这是我的index.html: 在IFrame页面中: PS:两个页面都在同一个域上…编辑:vid

  • 我正在尝试将一个jsp表单放入fancybox,我的站点功能正常,所以我知道我的大部分配置都是正确的。我还做了一个图像的样例测试,它工作得很好,但是对于一个表单,我有问题。下面是代码:

  • 问题内容: 我已经开始了angularjs项目,我想实现fancybox。 为此,我在解决方案中包含了jQuery和fancybox插件。我试图在下面的fancybox窗口中显示的代码中打开模板。 视图 控制者 还有 popup / add.html Fancybox成功打开了一个包含模板的窗口,但是该表达式尚未求值。谁能帮忙吗? 问题答案: 我已经为fancybox创建了指令