高幻灯片画廊与两个不同的缩略图

Highslide gallery with two different thumbnails

本文关键字：两个 略图 幻灯片      更新时间：2023-09-26

我想用hililide制作一个图库。

我有两个缩略图，一个较大的但裁剪的一个在页面上列出，如果点击打开大图，一个较小的具有不同长宽比的缩略图。

我如何配置hililide实际使用不同的图像缩略条?

例如这是标记的一部分:

<a href="highslide/sample-images/picture12.jpg" class="highslide" 
        title="Caption from the anchor's title attribute" 
        onclick="return hs.expand(this, config1 )">
    <img src="highslide/sample-images/picture12.thumb.jpg"  alt=""/>
</a>

链接指向大图，img显示裁剪后的缩略图。

我是否可以重写一个函数，例如使用两个缩略图，如:

<a href="highslide/sample-images/picture12.jpg" class="highslide" 
        title="Caption from the anchor's title attribute" 
        onclick="return hs.expand(this, config1 )">
    <img class="thumb" src="highslide/sample-images/picture12.thumb.jpg"  alt=""/>
    <img class="strip" src="highslide/sample-images/picture12.strip.jpg" style="display: none" alt="" />
</a>

其实我在前段时间找到了一个解决方案:

在hililide api参考http://hililide.com/ref/中有一个函数stripItemFormatter。函数的参数是要展开的元素(元素)。

此函数返回的字符串将被解析为html，并用作缩略条的一项。

如果你检查这个例子:http://hililide.com/ref/hs.stripItemFormatter你可以看到它是如何完成的

相关文章：