在没有<a> or <img/> tags?</a>的情况下将图像添加到JavaScript图像查看器

Question

简短版

有人能为我提供一个JS图像查看器，它支持在构造上传递图像数组的机制吗？

LONGER VERSION

我正在使用Colorbox查看页面上的一些图像。

我想要的情况是：

• 我通过缩略图上的<a>标记向观众添加图片（例如，使用类名）
• 我添加了更多将图像href传递给查看器对象的图像（这些图像的缩略图未显示）
• 当我点击我的第一个（也是唯一的）缩略图时，一个查看器会打开一个大版本的缩略图PLUS通过查看器对象添加图像。

我得到的情况：   - 我把空<a>标签（我也在CSS中看不见）指向我要添加的其他图像（没有缩略图）。

有人能为我提供一个JS图像查看器，它支持在构造上传递图像数组的机制吗？

Answer 1

你快到了。

在Colorbox中，您可以使用rel选项创建一组事物。例如：

$('.thumbnail').colorbox({rel: 'colorboxImg'})

上述代码表示当您点击类thumbnail的内容时，图片查看器将打开并加载所有类colorboxImg的项目。

所以，“你得到的情况”（如你所说）非常接近。添加一堆隐藏的<a>标记，并确保href指向正确的图像。为这些<a>代码提供一类colorboxImg（或者您决定为您的小组命名的任何内容）并且您已完成。请注意，.thumbnail还需要colorboxImg类。

如果您还有其他需要满足的案例，请告诉我们，我们可以编辑此答案。