使用單獨的文本錨擴展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圖像

回答

相關問題