列表懸停問題

我已經問過這個問題，但我認爲我不能很好地解釋問題。所以在這裏，我們又來了：列表懸停問題

http://i54.tinypic.com/1zp4kev.png

我有一個列表。使用上圖中顯示的默認背景色。我想讓第4項背景顏色改變#EDEDED在盤旋時。只有項目4.項目3，項目2應保持原始背景顏色。

我該怎麼做？我的問題是，當我將鼠標懸停在項目4上時，所有父項目的背景顏色也都變爲#EDEDED。任何JQuery或CSS解決方案，讚賞。

下面是上面列表的代碼：對＃評論-UL李

<ul> 
    <li class='comment'> 
     <div class='comment-body'> 
     item 2 
     </div><abbr class='timestamp' title='2011-02-18 11:39:32'>2011-02-18 11:39:32</abbr> 
     <div class='aut'> 
     Anonymous 
     </div><a href='#comment_form' class='reply' id='2' name="2">Reply</a> 
     <ul id='comments-ul'> 
     <li class='comment'> 
      <div class='comment-body'> 
      item 3 
      </div><abbr class='timestamp' title='2011-02-18 11:40:07'>2011-02-18 11:40:07</abbr> 
      <div class='aut'> 
      Anonymous 
      </div><a href='#comment_form' class='reply' id='3' name="3">Reply</a> 
      <ul id='comments-ul'> 
      <li class='comment'> 
       <div class='comment-body'> 
       item 4 
       </div><abbr class='timestamp' title='2011-02-18 11:40:12'>2011-02-18 
       11:40:12</abbr> 
       <div class='aut'> 
       Anonymous 
       </div><a href='#comment_form' class='reply' id='4' name="4">Reply</a> 
      </li> 
      </ul> 
     </li> 
     </ul> 
    </li> 
    <li class='comment'> 
     <div class='comment-body'> 
     item 1 
     </div><abbr class='timestamp' title='2011-02-18 11:39:28'>2011-02-18 11:39:28</abbr> 
     <div class='aut'> 
     Anonymous 
     </div><a href='#comment_form' class='reply' id='1' name="1">Reply</a> 
    </li> 
    </ul>

來源

2011-02-18 Hirvesh

是否有可能更嵌套項目（4個以上的深）？也就是說，您只是想讓最深層次的項目對懸停狀態做出響應？ – 2011-02-18 08:01:07

是的，可以有更多的neste項目，超越第4級。我只希望該級別響應，鼠標懸停在其上，其他一切保持不變... – Hirvesh 2011-02-18 08:03:35

在這裏你去：

$('li:not(:has(li))').hover(
    function() { 
     $(this).css({'background': '#EDEDED'}); 
    }, 
    function() { 
     $(this).css({'background': 'none'}); 
    } 
);

演示：http://jsfiddle.net/a6LqJ/

來源

2011-02-18 08:18:18

綁定懸停事件，添加一個延遲，所以，如果意圖是ITEM4其他項目不顯示背景。你可以嘗試使用http://cherne.net/brian/resources/jquery.hoverIntent.html插件

來源

2011-02-18 08:12:10 Sharad

列表懸停問題

回答

相關問題