使用单独的文本锚扩展Highslide图像

我成功使用Highslide在单击缩略图时展开图像。当点击下面的<p>标签中的锚点时，我无法让图片展开。使用单独的文本锚扩展Highslide图像

<div class="highslide-gallery"> 
    ... 
    <div class="feature"> 
     <a href="/images/001.jpg" class="highslide" onclick="return hs.expand(this, config1)"> 
      <img src="/images/thumbs/001.jpg" /> 
     </a> 
     <p> 
      <a href="/images/001.jpg" onclick="hs.expand(null, {src: '/images/001.jpg'});">Anchor Text</a> 
     </p> 
    </div> 
    ... 
</div>

页面加载时，显示展开图像的两个实例，一个位于另一个的顶部。

点击每个图像会正常关闭图像。

单击图像缩略图会导致出现两张展开的图像。

单击锚文本可以正常工作，即一个图像被展开并在点击时正常关闭。

我在做什么错？谢谢。

来源

2013-03-12 Chris

图像在页面加载两次扩展，因为你正在使用null，而不是在onclick的锚文本this。

正确的onclick：

<a href="/images/001.jpg" onclick="return hs.expand(this)">Anchor Text</a>

来源

2013-03-12 13:30:08 RoadRash

非常感谢 - 完美的作品。我对这个“这个”所指的是什么感到困惑。 – Chris 2013-03-12 14:11:19

只是不要试图将它与拇指带相结合。 thumbstrip将会选择缩略图图像和文本定位点，并将它们显示为带中的两个缩略图！ – MisterNeutron 2013-03-13 03:13:57

查看常见问题：[如何从我的HTML弹出窗口删除图库控件？]（http://www.highslide.com/forum/viewtopic.php?f=4&t=5093）（也适用于拇指贴图）。我们也有一个特殊的代码 - 看到这个jsFiddle：http://jsfiddle.net/roadrash/KAMNp/ – RoadRash 2013-03-14 09:10:28

只需将链接在一起：

div class="highslide-gallery"> 
    ... 
    <div class="feature"> 
     <a href="/images/001.jpg" class="highslide" onclick="return hs.expand(this, config1)"> 
      <img src="/images/thumbs/001.jpg" /><p>Anchor Text</p> 
     </a> 
    </div> 
    ... 
</div>

来源

2013-03-12 13:15:46 MisterNeutron

这改变了我的页面的布局，所以遗憾的是它不会作为解决方案的工作。 @RoadRash的答案正是我所追求的。 – Chris 2013-03-12 14:13:38

使用单独的文本锚扩展Highslide图像

回答

相关问题