0

我想将fancybox的一些功能集成到galleriffic中。基本上我想拥有一个使用galleriffic的带有各自缩略图的图像库。除了样式之外，我的方法看起来非常类似于： http: //www.twospy.com/galleriffic/example-2.html 此外，我希望能够放大显示的图像。为此，我正在使用fancybox。可以在此处找到其行为示例http://fancyapps.com/fancybox/demo/

我已经设法使我上面描述的内容稍微修改了galleriffic buildImage 函数，如下所示：

.append('<span class="image-wrapper current"><a class="advance-link fancybox" rel="group" href="'+imageData.image.src+'" title="'+imageData.title+'">&nbsp;</a></span>')

现在，galleriffic 添加了fancybox 类fancybox 需要以及图像源。这非常有效。

在这一点上，我发现了一个我似乎没有找到解决方案的问题。Fancybox 允许通过单击每个图像的右侧/左侧来导航图像集合，以转到集合中的下一个/上一个图像（正如您在上面提供的演示中可能已经注意到的那样）。我也想利用此功能，以便用户可以通过浏览galleriffic 的缩略图以及使用fancybox 的图像的缩放版本来浏览画廊。

我在这里发现的问题是，galleriffic 仅为已单击缩略图的图像创建一个 class="fancybox"。这使得fancybox 只能找到画廊的一张图片。我不想将类 fancybox 定义为为 Galleriffic 定义拇指的 's，因为我不希望在单击缩略图时缩放图像，而是在主图像上。

在某种程度上，我需要的是使用 fancybox 类生成所有的，但隐藏所有未显示的，而不是每次通过galleriffic 生成我需要的。这是我能想出的唯一解决方案，但它并不整洁。我喜欢galleriffic 在每次单击缩略图时如何处理生成主图像。

我想知道是否有人可以提出更好的解决方案。例如，fancybox 可以通过在下一个画廊缩略图中搜索来了解下一个图像。

我试图制作一个有效的 jsfiddle 演示，但涉及的代码太多。也没有明确的问题，而是实施的冲突。我认为您可以轻松复制我目前的情况。

感谢您的努力！

4

1 回答 1

0

我在上面尝试了你的方法，像你一样编辑 BuildImage 函数。对我来说，它成功链接到图像，但没有加载到 FancyBox。

我在主文件中有这段代码：

<script type="text/javascript">
    $(document).ready(function() {
        $(".fancybox").fancybox();
    });
</script>

你成功地将两者结合起来，对吗？

于 2013-10-25T19:32:52.830 回答