FancyBox图库集成

Question

我有一个关于FancyBox集成的问题。我会创建一个有10张图片但只有一个缩略图的画廊。例如：http://fancyapps.com/fancybox/demo/第一个演示展示了四个图像:森林、大海、日落和艾菲尔塔。我是否可以包括一个缩略图，例如埃菲尔铁塔的缩略图，单击该缩略图时，将在灯箱中显示埃菲尔铁塔的图像，但也会显示森林、大海和日落的图像。我尝试了很多方法，但都不能正常工作。如果你有什么想法..。非常感谢。

PS:我使用Twitter Bootstrap-1.3 & FancyBox-2

Answer 1

您需要指向图库中所有图像的链接，无论这些图像是否显示缩略图，因此您可以使用此html

<a class="fancybox" rel="gallery" href="image01.jpg"><img src="thumbnail01.jpg" alt="" /></a>
<a class="fancybox" rel="gallery" href="image02.jpg"></a>
<a class="fancybox" rel="gallery" href="image03.jpg"></a>
<a class="fancybox" rel="gallery" href="image04.jpg"></a>

等等..。这样，只会显示一个缩略图，而其余的链接是不可见的，但可以正常工作。

然后，像这样的脚本将启动图库

$("a.fancybox").fancybox();

Answer 2

您可以简单地将display:none添加到您不想显示的链接。

例如http://jsfiddle.net/MvvuE/