Question

我在Google网上论坛中发现此问题未得到解答，我在 Fancybox 中面临同样的错误。

我在一个页面上有更多图片库。当我去下一张图片使用下一个上一个按钮，等等，我将从中获取图像其他画廊。

使用灯箱可以执行以下操作：

<a href="url" rel="fancybox[gallery1]" >link</a>

我会从中获取所有图片图库中的gallery1。我的专辑是动态的，所以我无法做到在我的javascript文件中。

这可能吗？

我们如何控制此导航？

<div class="Album" />
<div class="AlbumImg">
   <a class="big_img" title="Tokyo" rel="flickr_group" href="tokyo.jpg"></a>
   <div id="Gallery0">
      <a class="big_img" title="Tokyo rel="flickr_group" href=""Tokyobig></a>
      <a class="grouped_elements" title="Tokyo" rel="Gallery0" href="Tokyo1"></a>
   </div>
  <div id="Gallery0">
     <a class="grouped_elements" title="Tokyo" rel="Gallery0" href="Tokyo2"></a>
   </div>
   <div id="Gallery0">
      <a class="grouped_elements" title="Tokyo" rel="Gallery0" href="Tokyo3.jpg"></a>
   </div>
   <img class="first" src="Tokyo" title="Tokyo" />
   </a>
</div>

<div class="AlbumImg">
   <a class="big_img" title="Tokyo" rel="flickr_group" href="tokyo.jpg"></a>
   <div id="Gallery1">
      <a class="big_img" title="Tokyo rel="flickr_group" href=""Tokyobig></a>
      <a class="grouped_elements" title="Tokyo" rel="Gallery1" href="Tokyo1"></a>
   </div>
  <div id="Gallery1">
     <a class="grouped_elements" title="Tokyo" rel="Gallery1" href="Tokyo2"></a>
   </div>
   <div id="Gallery1">
      <a class="grouped_elements" title="Tokyo" rel="Gallery1" href="Tokyo3.jpg"></a>
   </div>
   <img class="first" src="Tokyo" title="Tokyo" />
   </a>
</div>

这是我所拥有的代码，每张专辑都有许多图片。当我点击第一张专辑的最后一张图片然后导航时，我会看到第二张专辑的第一张照片。但我想循环回到同一个人的第一张图片

Answer 1

您粘贴的代码包含很多错误......

您有多个div具有相同的id，且这些属性未包含在引号中，<div class="AlbumImg">中有一个不匹配的结束标记{{1} }。我不太确定这对你的例子有什么影响，但你一定要深入了解它。正如Ruben所说， fancybox 也可以使用</a>属性，就像灯箱一样。

您的代码应如下所示：

rel

如果您希望自己的画廊循环播放，则必须将参数传递给 fancybox 。请参阅documentation。应该是这样的：

<div class="albums">
    <div class="gallery1">
        <a href="http://placehold.it/350x150.png" rel="gallery1">
            <img alt="" src="http://placehold.it/150x150.png"/>
        </a>
        <a href="http://placehold.it/350x150.png" rel="gallery1">
            <img alt="" src="http://placehold.it/150x150.png"/>
        </a>
        <a href="http://placehold.it/350x150.png" rel="gallery1">
            <img alt="" src="http://placehold.it/150x150.png"/>
        </a> 
    </div>
    <div class="gallery2">
        <a href="http://placehold.it/350x150.png" rel="gallery2">
            <img alt="" src="http://placehold.it/150x150.png"/>
        </a>
        <a href="http://placehold.it/350x150.png" rel="gallery2">
            <img alt="" src="http://placehold.it/150x150.png"/>
        </a>
        <a href="http://placehold.it/350x150.png" rel="gallery2">
            <img alt="" src="http://placehold.it/150x150.png"/>
        </a> 
    </div>
</div>

Answer 2

<a class="grouped_elements" rel="gallery-x" href="Tokyo3.jpg">

这应该有用吗？别忘了' - '
如果它不起作用，你能提供jquery代码吗？

Fancybox循环播放多个专辑

2 个答案: