1

header と呼ばれる div 内にリストがあり、各リストにカーソルを合わせてリストを展開したいのですが、マウスがヘッダー div から移動するまで、カーソルを合わせたすべてのリストを開いたままにしておきます。これまでのところ、各リストに個別にfadeIn/fadeOutを使用するか、各リストをfadeInにして開いたままにしておくことができますが、divから移動するたびにfadeOutはできません。

ここに私が使用しているコードがあります: http://jsfiddle.net/jTCdg/11/

JavaScript でコメントアウトされた行は、すべてのリストが表示されたままになるか、ホバー時のリストのフェードイン/フェードアウトの間で変化するかです。

JavaScriptを使うのはこれが初めてなので、助けていただければ幸いです。ありがとう

4

1 に答える 1

5

jQuery hoverは、 mouseenterおよびmouseleaveイベント ハンドラーのショートカットです。両方を別々に定義できます。

$(document).ready(function() {
    $("#header ul").mouseenter(function() {
        $(this).find("li").fadeIn();
    });
    $("#header").mouseleave (function() {
        $(this).find("li").fadeOut();
    });
});

更新された jsfiddleも参照してください。

于 2012-04-22T10:05:19.817 に答える