javascript - 来自隐藏 div 中的内联图像的灯箱？

Question

我有一个带有一些内联图像的隐藏 div：

<div id="mydiv" style="dispay:none;">
   <img src="data:image/jpeg;base64,..." />
      ...
   <img .../>
</div>

现在，我不想有一个灯箱，它会显示这些图像。问题是大多数灯箱实现都接受指向图像文件的锚点作为输入。

Colobox，可以采用内联 html，但不能采用多个 html 片段来呈现画廊（带有上一个和下一个按钮）体验。你有什么想法：

1. 如果可以将colorbox配置为显示此类数据？
2. 是否有替代的 jQuery 插件可以做到这一点？
3. 如果没有可行的解决方案，如何快速实施？

任何帮助，将不胜感激。

Answer 1

Colobox，可以采用内联 html，但不能采用多个 html 片段来呈现画廊

当然可以。像这样的东西应该可以工作，但还有其他选择：

$('#mydiv img').colorbox({
    rel:'my-group', 
    inline: true,
    open: true,
    href: function(){ return this; }
});

Answer 2

一定会有一些灯箱在隐藏内容的显示的基础上工作（如果保持标记的原样很重要）。Bootstrap 灯箱就是其中之一。

但是，如果您已经对 Colorbox 有偏好，我相信它可以完成任务：这个演示展示了调用多个图像的示例。如果数据 URI 有问题，您可以将其用作链接 - 如果需要为组中的其他图像提供单独链接的问题，您可以隐藏那些display:none（与您当前相同）做你的img）。