Question

我想将一些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允许通过单击每个图像的右/左侧来浏览图像集合，以转到集合中的下一个/上一个图像（正如您在上面提供的演示中所注意到的那样）。我也想利用这个功能，以便用户可以浏览画廊的缩略图，以及使用fancybox通过缩放版本的图像浏览画廊。

我在这里找到的问题是，galleriffic仅为已经点击缩略图的图像创建了一个class =“fancybox”。这使得fancybox只能找到一个图库。我不想将类fancybox定义为为galleriffic定义拇指的类，因为我不希望在缩略图上但在主图像上缩放图像时。

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

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

我试图制作一个有效的jsfiddle演示，但涉及的代码太多了。此外，没有确定的问题，但实施的细节。我想你可以很容易地复制我目前的情况。

感谢您的努力！

Answer 1

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

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

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

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

将fancybox整合到galleriffic中

1 个答案: