2012-01-17 6 views
4

私はSuperfishを使用しており、少し違ったスタイルにしようとしています。基本的には、ulを使ってメニューを表示すると、ドロップダウンメニューがうまくいきます。そのドロップダウンの要素の上にカーソルを置くと、:hoverでその要素がスティールされているので、テキストの色は問題ありません。別の要素/クラス上にカーソルを置いてCSSテキストの色を追加/削除する

私がその要素の上に乗っていないとき、それはトップレベルの色を使用します。

白いままにしておきたい - 背景色の違いを無視して、何か試してみました。

マイCSS http://pastebin.com/Hy1Rdwxb

私はこれが白に滞在してもらうためにjQueryの.addClassを使用する必要がありますか?

.sf-menu li:hover, .sf-menu li.sfHover, 
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { 
     background:    #ae9b9d; 
     outline:    0; 
     color: #eee !important; 
} 

、変更/効果を得るために.sf-menu li:hover > a.sf-menu li:hoverを追加したいと思う:これはそれを着色されたものであると仮定すると、

答えて

2

。問題は、aタグのためのより具体的なスタイリングがあるので、ホバー上に着色されないことです。上記のように、liの直下のaタグをCSSでスタイルすることができます。

>オペレータが直接以下のすべての要素のスタイルを設定しないことであることに注意してください、あなたが望むだけの1が、won't work in IE 6(あなたのスタイルのいくつかは、あなたがそれをサポートします示しているように見えることから、which you shouldn'tあなたの聴衆があなたの手を強制しない限り、これはIE6でまだ変色が見られることを意味します。

+0

私はIE6を省略して、それを受け入れても構いませんが、CSSは実際にはスーパーフィッシュです。 – SMacFadyen

+1

独自のスタイリングを追加できます。 '.sf-menu li:hover> a {color:#eee!important; } 'をあなた自身のCSSコードで置き換えてください。 – Ktash

+0

これはうまくいきます。ドロップダウンの外にホバリングすると、トップレベルの色が再び使用されます。任意のトリック/アイデアですか? – SMacFadyen

関連する問題