当没有锚标记时，我可以在图像上使用Colorbox吗？

Question

我正在尝试使用Colorbox创建幻灯片。不幸的是，我无法控制图像的创建方式，因此我无法将锚标记或rel =置于图像上。

我能做的最好的事情是这样的：

<div id="cbImg" class="slideshow">
    <img src="file1.png" />    
    <img src="file2.png" />
    <img src="file3.png" />
    <img src="file4.png" />
</div>

图片代码可以包含高度，宽度和alt标签......但它是动态生成的。我可以控制的只是图像周围的DIV标签。图像周围可能有也可能没有其他标签（p，div，span）。

我想要这样的事情：

<div id="cbImg" class="slideshow">
    <a href="file1.png" rel="slide" class="pop"><img src="file1.png" /></a>
    <a href="file2.png" rel="slide" class="pop"><img src="file2.png" /></a>
    <a href="file3.png" rel="slide" class="pop"><img src="file3.png" /></a>
    <a href="file4.png" rel="slide" class="pop"><img src="file4.png" /></a>
</div>

是的，这是来自CMS ......不，我无法修改它的渲染方式。我正在尝试制作幻灯片（如果可能的话）。

Answer 1

基本上，我最终使用JQuery动态创建IMG标签周围的锚标签...然后让我添加类和rel =我需要使用ColorBox选项。

以下是我用于提示如何创建锚标记的答案之一：

jQuery: Easiest way to wrap an image tag with an A anchor tag

Answer 2

另一种方法是通过XSLT转换博客文章。但是，如果图像在博客文章内容中，这并不容易（特别是当Ektron使用XSLT 1.0时，它没有正则表达式支持）。

如果您想要执行此服务器端，您可能必须获取内容并执行字符串替换。或者，您可以使用您的jQuery解决方案并使用NodeJS在服务器端运行。