推 s25g5d4:http://jsfiddle.net/RmBxB/1/ 這是我的寫法 05/10 23:35 昨天母親大人叫我早點睡 只好匆匆改完你的code就跑了 沒有解釋我的想法 首先先奉上剛剛改好的第二版 http://jsfiddle.net/RmBxB/3/ 剛看到你的html時 其實我覺得有點亂 實際上並不需要那麼多div 你可以全部都用div做巢狀結構這樣html看起來會很整齊、漂亮 或是也可以用ul li讓html語意更強烈 另外class是可以累加上去的 總之我重新組織了你的html 簡化多餘的部分 並且加入多個accordion支援 相對來說css也要修改 其中比較重要的是 #Nav ul.accordionPart{ width:197px; margin:0; background: #313132; color: #fdfdfd; text-decoration: none; text-shadow: 0px 1px 0px rgba(0,0,0, .35); display: inline-block; float:left; box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1); } 這裡的display:inline-block;以及float:left; 可以讓多個ul.accordionPart 往右橫向排列 同時在 #Nav { width:394px; margin:0 auto; } 要給他正確的width 以及margin 這樣才能將其置中 #Nav .accordionPart li ul.content {/*隱藏所有子選單 以及設定子選單之margin*/ margin: 6px 0; display:none; } 還有script裡的hover( addClass("menu_on"); [讓我省略一下 :)] 其實這個用css就能達成了 只要在selector後面加上:hover 就能設定當滑鼠移過去時要顯示的樣式 秉持著js能省的部分就省(效能關係) 所以就把hover改用css解決了 :) 同理.siblings().hide()透過display:none也能解決 所以最後的script部分只剩下slideToggle部分 節省不少 其他css的變動應該參照我的註解就能了解了 有問題歡迎提出來 再來回到你原本的問題(以及原本的code) 第一個是第三層之content不會變綠色 主要是你的selector並沒有選到第三層的div.content $('#Nav ul.accordionPart li div.menu').hover(function(){ ^^^^^^^^ 實際上你只有選到div.menu 所以div.content是不會有反應的 第二個問題是hover第二層時 上色左邊會留空 而沒有填滿整條 那是因為如上述你選擇的是div.menu 所以你選擇到的是第二層的<div class="menu">aa</div> 並且對他做上色 實際上他是有填滿整條的 但是因為他位於ul.accordionPart li div.content下 這裡你的css寫了一條padding-left:10px; 所以造成他左邊留空了10px 其實不用在ul.accordionPart li div.content時就給他padding-left:10px 你可以在第二層的div.menu再給他padding-left:10px 同時上色 這樣就會變整條綠色了 ※ 引述《aoika (ka)》之銘言： : 標題: [問題] 三層accordion問題 : 時間: Thu May 10 22:24:37 2012 : : 新手有點問題想發問 : : 目前做出了三層的accordion選單，都可以跑 : 可是在特效上似乎出現一些問題 : : 1.如何在滑過任何一層時，綠色長度固定都一樣? : (在這邊試過很多次，為了讓1.2.3層有前後之分做了padding， : 但是之後的menu_on都會縮短，無法每一層都同長) : : 2.如何在滑到第3層aaa時，仍有綠色特效? : : 以下是我的程式碼 : http://jsfiddle.net/PDSDG/3/ : : : 不知道是哪裡出錯了，好像是在menu_on那邊無法判斷 : 可以請大家幫我看一下嗎 : 謝謝大家 -- → asdfg0612:3.4樓是甚麼鬼梗 (￣ー￣；) 01/29 10:51 推 key0077:亻也 曰 弓長 父 01/29 10:51 文章代碼(AID): #1F9B9uQM (C_Chat) [ptt.cc] [公告] art33 水桶20年 --

※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 59.127.251.59