首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在同一页面上创建单独的Fancybox库?

如何在同一页面上创建单独的Fancybox库?
EN

Stack Overflow用户
提问于 2012-02-28 16:43:39
回答 5查看 30.3K关注 0票数 13

我们使用的是jQuery 1.7.1和Fancybox 1.3.4。我是Fancybox的新手。我以前从来没有使用过它,但它被广泛使用在一个网站上,我正在工作。建立Fancybox的人被解雇了因为他..。不相干。:)

我正在创建一个产品比较页面。多达四个产品将显示在一个页面上。每个产品可能有多达五个特定于该产品的图像。

当前,当我单击任何图像时,Fancybox会弹出并创建页面上所有图像的库。所以,如果我有一个有五个图像的产品,就有一个五个图片库。如果我有四个有五个图像的产品,就有一个有二十幅图像的画廊。这对我来说不太好。

我想要的是每个产品都有自己的画廊。如果他们点击产品A,他们只会看到与产品A相关的图片,如果他们点击产品B.你明白了。

如何使Fancybox在单个页面上创建单独的图库?

编辑

目前,我的rel属性被设置为‘auto人字库’。下面的答案之一建议我将其改为类似的东西,这将产生我正在寻找的东西:

代码语言:javascript
复制
<img rel='Gallery1'>
<img rel='Gallery1'>
<img rel='Gallery2'>
<img rel='Gallery2'>
<img rel='Gallery3'>
<img rel='Gallery3'>

如果我将rel属性更改为除“自动库”之外的任何内容,单击图像只会将图像打开到一个新窗口中。

EN

Stack Overflow用户

发布于 2018-01-30 10:04:52

我在Fancybox 3上也遇到了同样的问题--使用rel="gallery"data-fancybox-group="gallery"都没用。

通过添加.attr('data-fancybox', 'gallery');找到使其工作的代码依赖/小提琴

https://codepen.io/anon/pen/EwpOxE?editors=1010

票数 2
EN
查看全部 5 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9486034

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档