[問題] 點擊列表後更換圖片(同一區塊裡)

[lcy17 (Aoie)]

各位好

我是想在畫面左邊設一排列表 1~8個步驟

畫面右邊設個div還有限制長寬 600*400
圖片一次只能顯現一張 點一個步驟出現一個畫面(共八張圖
圖片如果沒用overflow是顯示垂直向下排列
假如我在jquery那設
$("列表1的class").click(function(){
        ("畫面div_").show("圖1的class")
我有想說用陣列(一個列表八個按鈕各對應八張圖片)
請問這樣是否可行呢?

02/14 update:
由於不會寫陣列的code
所以我把圖片都display none 堆疊在顯示區域
以下是朋友有幫忙修改的 只有前兩個步驟有成功:s
$('.accordion h3').click(function(){
  count=$(this).index()
  console.log(count)
$(".swing div").eq(count).fadeIn().siblings().fadeOut()

consolelog 列表顯示是0,4,7,9,13,15,17,19
我想改成1~8
目前只知道用var 可是跟要設定1~8我連不起來...

麻煩各位前輩!! 謝謝!!




是否還有其他方法可以正確顯示?

謝謝




--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 1.164.136.37
※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1486965370.A.040.html
※ 編輯: lcy17 (1.164.136.37), 02/13/2017 14:18:27
※ 編輯: lcy17 (1.164.136.37), 02/13/2017 18:39:26
→ steven11329: selector用id抓耙，聽你描述都做得到。
→ steven11329: 感覺用for就夠了。
→ akccakcctw: 可行，但是寫成迴圈比較好，指定圖片我的話會用data-*
※ 編輯: lcy17 (118.160.75.246), 02/14/2017 12:05:42
※ 編輯: lcy17 (118.160.75.246), 02/14/2017 12:06:14
※ 編輯: lcy17 (118.160.75.246), 02/14/2017 16:35:31
※ 編輯: lcy17 (118.160.75.246), 02/14/2017 17:19:32
推 akccakcctw: 亂寫了一個 https://jsfiddle.net/99v2gkp3/
         TY....我照本宣科的抄居然還是不行...是h3不能拿來像當div用嗎?
※ 編輯: lcy17 (118.160.75.246), 02/14/2017 19:37:47
→ akccakcctw: 先看看console有沒有錯誤吧，沒有的話要看到code才知