Thumnails和图像编号

我正在使用FancyBox来显示组成书籍的大量页面。我使用Fancybox，因为它似乎是我尝试过的无数个画廊插件，它以合理的方式处理大于屏幕的图像。

我正在使用缩略图，因为我希望能够跳过图像，例如从图像1到图像30，而不通过每个图像，但缩略图看起来都一样 – 是否有任何方法可以自定义缩略图只显示图像编号。另外因为图像非常大，是否有一种方法可以为缩略图提供与全尺寸图像不同的URL？

提前感谢您的帮助

之前我有过这个请求，但遗憾的是没有办法“开箱即用”，你必须手动完成。

考虑到您使用的是最新版本的fancybox（ v2.0.5 ），请按照下列步骤操作：

1：制作文件jquery.fancybox-thumbs.js （ helpers文件夹）的副本，并用jquery.fancybox-thumbs-NO-image.js重命名。我们将在保留原始文件的同时修改此文件。

2：编辑新文件（ jquery.fancybox-thumbs-NO-image.js ）并查找第49行，其中显示：

 list += '
';

并用这个替换该行：

 list += '' + (n+1) + '
';

3：寻找它所说的第55行

 //Load each thumbnail $.each(F.group, function (i) { ...

并使用javascript多行注释语法（如： /* $.each ... */ ）注释掉整个$.each()函数，一直到第94行+/-

保存并关闭您的文件。

4：链接到html文档中的该文件，如：

而不是原始文件。

5：要为您的数字添加一些样式，请添加内联CSS声明（在加载所有fancybox css文件之后），如：

6：javascript。您可以使用首选的API选项。只需注意thumbs选项，我设置的值与数字的大小匹配得更好（例如， height与CSS内联声明中的line-height相同）

瞧！见DEMO

Fancybox v2.0.6的注释（2012年5月30日） ：

后续版本可能会再次移动行号，但基本上您应该查找相同的信息块。

请记住，我们正在编辑自己的jquery.fancybox-thumbs.js文件的自定义版本。