謝謝版友的指導，讓我清楚很多
接下來我又遇到一個問題
我想讓他長度長的話，有個scrollbar
先用網路上的範例
http://www.scriptiny.com/2009/09/javascript-scrollable-div/
自己套上之後，發現在
#scrollcontent ul#accordion li ul.content{
margin:6px 0;
display:none;
}
出了問題，如果有了display:none;
則捲軸不會出現。
如果沒有了display:none;
一切正常，可是會呈現都打開的狀況
以下是我的code，在這方面，跟js有關係嗎
http://jsfiddle.net/yJWJU/
謝謝
※ 引述《s25g5d4 (死城盜賊)》之銘言：
: 要給他正確的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 同時上色
: 這樣就會變整條綠色了
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 125.231.135.131