0

<li>理想的には、メニューにカーソルを合わせてそれぞれを強調表示したいのです<li>が、テストとして、ホバー時にクラスを変更するには次のようにします。これがうまくいかない理由はありますか？

本当にありがとう。

.dropdownhoverIn a:hover
{
    background-color: White;
    color: #39C;
}

 <form id="form1" runat="server">
        <div id="multiDropMenu">
            <ul id="menu">
                <li><a href="#" id="places">Places</a>
                    <ul id="dropdown1">
                        <li><a href="http://google.com">To Go</a></li>
                        <li><a href="#">To See</a></li>
                    </ul>
                </li>
                <li><a href="#">Transportation</a></li>
            </ul>
        </div>
    </form>

$(document).ready(function() {
    $("#menu li").hover(function() {
        $(this).find("ul").find("a").hover(function() {   
            $(this).addClass("dropdownhoverIn"); 
        });
        $(this).find("ul").slideToggle(250);
    });
});
4

1 に答える 1

0

「内側」の.hover()割り当てを取り除き、

$("#menu > li").hover(function() {
    $(this).find("ul a").addClass("dropdownhoverIn");
    $(this).find("ul").slideToggle(250);
});​

クラスの:hover疑似セレクター。

.dropdownhoverIn {
    background-color: White;
    color: #39C;
}​

試してみてください: http://jsfiddle.net/GKZRU/

.hover()関数パラメーターを呼び出すと、ハンドラーが割り当てられます。にカーソルを合わせるたびにそれを行う理由はありません<ul>。

また、jQuery の を使用している場合.hover()は、CSS で実際には必要ありません。互換性のために必要な場合は、別の CSS セレクターが必要です。

の子でのみアクティブ化する必要があると想定>しているため、 のセレクターにも追加しました。.hover()#menu

于 2010-08-17T22:42:36.310 に答える