1

まず、私が抱えている問題を説明させてください。私が話していることを知るには、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

4

5 に答える 5

6

何かが欠けていない限り、jquery はここではやり過ぎです。シンプルな CSS で十分です。

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

子liは親から色を継承します。

http://jsfiddle.net/7Jz9a/

于 2013-05-13T17:50:48.543 に答える
2

jQuery の ".hover()" を使用する代わりに、CSS だけでこれを行うことができるはずです。ただし、既存の CSS にはすでに競合するスタイルが含まれており、2 倍になった jQuery の動作 :hoverではうまく機能しません。.hover()

CSS をクリーンアップすることから始めます。jQuery を使用する必要がある場合は、少なくともきれいな状態になります。

于 2013-05-13T17:53:10.033 に答える
1

次の簡単なcss追加を試してください

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

それが役立つことを願っています

于 2013-05-13T18:01:33.153 に答える