如何顯示另一個列表中相對於另一個項目的項目？

Question

我試圖創建一個子彈導航欄，瀏覽一系列圖像。

我還想在突出顯示的項目符號正下方顯示縮略圖。

我的方法是動態創建兩個列表 - 一個無序的項目符號列表和一個無序的縮略圖列表。荷蘭國際集團以兩個列表和append()（append()子彈一個列表，然後append()縮略圖到其他列表）

然後我添加hover()功能 - 我通過，我有所有的圖像迭代這樣做每個項目符號都會隱藏所有縮略圖，但會顯示相應的縮略圖。

它的作品 - 但縮略圖總是出現在同一個固定的地方。 如何在突出顯示的項目符號下顯示它？

請參閱我的jsfiddle這裏： http://jsfiddle.net/beeband/u2zKE/

NB。有一個錯誤 - 最後兩個拇指從不出現 - 不知道發生了什麼，圖像存在。可能有關係？

Answer 1

http://jsfiddle.net/u2zKE/2/

在這裏你去

的問題是，你使用索引屬性和第一個元素將返回2. http://jsfiddle.net/u2zKE/3/

那麼什麼是錯在你的DOM。

我修改了代碼以使用自定義data-index attribute。因爲那裏現在DOM可能是腐敗的。

var liMarkup = $('<li class="bulletButton" data-index="'+i+'"><a href="#">'+i+'</a></li>'); // New line with data-index attribute 

而其他的變化，使用數據索引屬性insteed

.eq($(this).data("index"))//Get the li at same index which triggered hover