徘徊在父李讓孩子李白色，反之亦然

首先讓我來描述我遇到的問題。請訪問http://dev.eduantech.com/about-me瞭解我在說什麼。必須是一個頁面，不能是主頁，這樣你才能看到我在說什麼。徘徊在父李讓孩子李白色，反之亦然

好吧，請將鼠標懸停在菜單上，至少有一個菜單中有子菜單。您會注意到，當您將鼠標懸停在父項li上時，孩子li變爲「不可見」，因爲它與背景顏色相同。反之亦然，如果你將鼠標懸停在子元素上。

我需要弄清楚的是，我相信你已經猜到了，無論何時鼠標位於其中任何一個位置，它都會使另一個位置變白。

我有以下幾點幾分僞代碼擬定：

$('li.menu-parent-current > li.menu-child-current a').hover(
    function() { 
     $(this).css('color', '#fdfdfd'); 
    }, function() { 
     if (/* mouse leaves parent as well */) { 
      // change child color to blue 
     } else if (/* mouse did not leave parent */) { 
      // make child color white 
      $(this).css('color', '#fdfdfd'); 
     } 
    });

有空間上的這種改進，毫無疑問的，所以，儘管在必要時提供更好的版本。 :)

我已經在這個過去的幾個小時，但我無法解決它，我敢肯定這是簡單的，但我不是jQuery專家。感謝您提供的幫助。 :)

編輯：

嗯......原來我在複雜了。作爲一個相對的新手不會讓你思考正確。：P

來源

2013-05-13 greduan

你可以做到這一點與CSS和jQuery。

如果你這樣做與CSS：

li:hover a{color:#fff;} 
li:hover ul li a{color:#fff;}

如果你想這樣做，使用jQuery：

$('ul li').hover(
    function(){$(this).find('a').css('color','#fff');}, 
    function(){$(this).find('a').css('color','##36c');} 
);

來源

2013-05-13 18:12:16 edonbajrami

這一個非常好的答案，保持良好的工作。:)我要說新人，但我不想聽起來傲慢。：P感謝所有提供了答案的人！然而，這是最乾淨的，所以謝謝大家。 :) – greduan 2013-05-13 18:14:47

除非我錯過了一些東西，jquery在這裏是過度殺傷。簡單的CSS就足夠了：

li:hover{ 
    background-color: blue; 
    color: white; 
}

孩子li繼承父的顏色。

http://jsfiddle.net/7Jz9a/

來源

2013-05-13 17:50:48

agreed- http://jsfiddle.net/Pfeam/ – imjared 2013-05-13 17:51:55

你應該能夠只用CSS這樣做，而不是也使用jQuery的「.hover（）」中。但是，您現有的CSS已經有一些衝突的:hover樣式，並不能很好地與雙擊jQuery .hover()行爲一起使用。

我會先清理CSS，如果你必須使用jQuery，那麼至少你會有一個更清潔的石板。

來源

2013-05-13 17:53:10 JacobMcLock

只需使用

#menu li:hover a { 
    color: white; 
}

來源

2013-05-13 17:58:23 Arbel

用以下簡單的CSS除了嘗試

#menu li:hover a{ 
    color: #FDFDFD; 
}

希望這將有助於

來源

2013-05-13 18:01:33

徘徊在父李讓孩子李白色，反之亦然

回答

相關問題