懸停狀態是古怪

Question

我一直在一個下拉菜單，有兩個家長和孩子不同的顏色，這改變懸停狀態時：

http://jsfiddle.net/cELJ6/1/

我有一個小怪癖用這雖然。

該Home鏈接是好的，因爲是Products和Section2罰款時沒有徘徊。

的問題是：

1）當我懸停在Product，鏈路的顏色必須是白色。 （BG顏色是罰款和工作正常）

2）當我將鼠標懸停在一個子元素，如Product1，然後Products鏈接的顏色必須是白色

Products和Section2之間徘徊，似乎是相當古怪。有時顏色是白色的，有時是灰色的（＃777）

有沒有辦法解決這個問題？

謝謝

Answer 1

這並不奇怪，這就是你的代碼的工作原理。

JavaScript中的顏色定義應用爲內嵌樣式，它比正常的css樣式更高。這適用於灰色並導致怪癖。爲什麼你有JavaScript呢？

編輯： 我編輯你的小提琴到我想你想要它的行爲。我只是將顏色聲明從a移到了父項li，同時給出了acolor:inherit。

http://jsfiddle.net/cELJ6/2/

Answer 2

$('ul > li.leaf').each(function(){ 
    $(this).mouseenter(function(e){ 
     $(this).find('a').css('color','white'); 
    }); 
    $(this).mouseleave(function(e){ 
     $(this).find('a').css('color','#777777'); 
    }); 

    }); 

$('.expanded > ul.leaf').each(function(){ 
    $(this).mouseenter(function(e){ 
     $(this).find('a').css('color','white'); 
    }); 
    $(this).mouseleave(function(e){ 
     $(this).find('a').css('color','#777777'); 
    }); 

    });