Question

我正在使用Highslide来显示我的照片。我想介绍简单的画廊 - 如果有人点击照片“dolno.jpg”，它将显示3张照片的画廊。现在只有一个（1.jpg）。我有3张照片： 1.jpg，2.jpg，3.jpg 我怎样才能做到这一点？这是我的代码：

<script type="text/javascript" src="/highslide/highslide.js"></script>
<link rel="stylesheet" type="text/css" href="/highslide/highslide.css" />
<script type="text/javascript">
    // override Highslide settings here
    // instead of editing the highslide.js file
    hs.graphicsDir = '/highslide/graphics/';
</script>

<td>
<a class="highslide" href="1.jpg" onclick="return hs.expand(this, { captionText: '<b>THIS</b>' } )">
<img src="/logafirm/dolno.jpg" id="imgg" title="Click to enlarge" height="80" weight="80"></a>
 <font color="#52180"><b>THIS</font></b></A>
</td>

Answer 1

只需复制要显示的每个其他图像的锚元素。

喜欢这个

<a class="highslide" href="1.jpg" onclick="return hs.expand(this, { captionText:    '<b>THIS</b>' } )">
  <img src="/logafirm/dolno.jpg" id="imgg" title="Click to enlarge" height="80" weight="80">
</a>
<a class="highslide" href="2.jpg" onclick="return hs.expand(this, { captionText: '<b>THE OTHER IMAGE</b>' } )">
  <img src="/logafirm/THE_OTHER_IMAGE.jpg" id="imgg" title="Click to enlarge" height="80" weight="80">
</a>

您还需要指定幻灯片设置..

根据文件：

<script type="text/javascript">
hs.addSlideshow({
// slideshowGroup: 'group1',
interval: 5000,
repeat: false,
useControls: true,
fixedControls: true,
overlayOptions: {
    opacity: .6,
    position: 'top center',
    hideOnMouseOut: true
}
});

// Optional: a crossfade transition looks good with the slideshow
hs.transitions = ['expand', 'crossfade'];
</script>

最后..如果你只想显示第一个缩略图，只需隐藏其他的..用CSS或者更好的javascript（没有js的用户会看到图像）

Answer 2

Highslide有一个内置的机制来做你想做的事情 - 不需要用CSS或Javascript来隐藏其他两个缩略图。

http://www.highslide.com/examples/mini-gallery.html

高滑道画廊

2 个答案: