jquery - jQueryで簡単に切り替える

Question

liホバーをオンに切り替えたい2つのがあります。単純ですが、期待どおりに機能しません。

$('ul li:first').hover(function () {
    $(this).hide();
}, function () {
    $(this).show();
});

フィドル： http： //jsfiddle.net/wg9cS/

ホバー時に、最初の部分を非表示にし、2番目の部分をスライドアップしたいのですが、現在は変動しています。

Answer 1

これは、要素を非表示にするとmouseleaveイベントがトリガーされるため、要素が表示され、mouseenterイベントが再びトリガーされるためです。つまり、イベント ループです。

$('ul li:first').mouseenter(function () {
    $(this).hide();
});

$('ul li:eq(1)').mouseleave(function () {
    $(this).prev().show();
});

http://jsfiddle.net/wg9cS/2/

Answer 2

http://jsfiddle.net/wg9cS/6/

$('ul li:first').hover(function () {
    $(this).slideUp();
});

$('ul li:nth-child(2)').mouseleave(function () {
  $(this).parent().find(":first").slideDown();
});

これがスライドするバージョンです。編集：未定義のものはよりエレガントです。