2

Jqueryを使用して次のdivを見つけようとしています。コードは次のとおりです。

$('.menu-item').hover(function() {
  $(this).stop(true, true).addClass("menu-item-hover", 300);
  $(this).next('div').stop(true, true).fadeIn(300);
}, function() {
  $(this).stop(true, true).removeClass("menu-item-hover", 300);
  $(this).next('div').stop(true, true).fadeOut(300);
});


<a href="media.html"><div class="menu-item"><h1>Media</h1></div></a>
<div id="tooltip-media">Sights and sounds from Cambodia</div>

<a href="about.html"><div class="menu-item"><h1>About</h1></div></a>
<div id="tooltip-about">Who in the world is the Phillips Family?</div>

単純。toolip-*div は css に隠されています。コードの次のものをホバー時に表示したいmenu-item. 他の質問を確認しましたが、私の場合はどれもうまくいきません。Jquery と Jquery UI の両方を使用しています。助けてくれてありがとう。

4

2 に答える 2

1

これを試して

$(this).parent().next('div').stop(true, true).fadeIn(300);

あなたの例では、次を見つけようとしていますがdiv、メニュー項目の兄弟ではありません。それだけではうまくいきませんでした。親にトラバースし、次にdiv機能することを見つけます。

親()次()

于 2012-10-23T08:57:37.840 に答える
1

まず.next()、すぐ隣の兄弟のみを取得します。すべての兄弟を検索するわけではありません。そのためには、 を呼び出す必要があります.nextAll('div')<div>しかし、探しているノードが同じ親要素に含まれていないため、この関数でさえここでは役に立ちません。

あなたは次のように行くべきです

$( this ).parent().next( 'div[id^=tooltip]' ).stop( true, true ).fadeOut( 300 );

参考:.next().nextAll()

于 2012-10-23T08:58:46.503 に答える