0

さまざまなサブナビゲーション要素がいくつかあるページがあります

私のマークアップは(基本的に)

<div class="sub-nav">
 <div class="sub-nav-btn"></div>
  <ul>
  </ul>
</div>
<div class="sub-nav">
 <div class="sub-nav-btn"></div>
  <ul>
  </ul>
</div>
<div class="sub-nav">
 <div class="sub-nav-btn"></div>
  <ul>
  </ul>
</div>

私の現在のjqueryは

$('.sub-nav ul').css("display","none");
$('.sub-nav-btn').click(function(){
$('.sub-nav ul').toggle();
return false;
});

現在これは機能しますが、と呼ばれる関連するすべての要素を開きます。jqueryを機能させて、関連する要素のみを呼び出し、すべてを呼び出さないようにするにはどうすればよいですか?

4

2 に答える 2

1

HIyaデモ http://jsfiddle.net/4aMwA/ またはここでより組織化されたフィドル: http://jsfiddle.net/s2CtY/

slideToggle http://api.jquery.com/slideToggle/

デモ用のサンプル テキストをいくつか置いておきます ** をクリックするfooと表示 され、クリックすると下にスライドするのが表示ulされます。fpul

jqueryコード

  $(document).ready(function () {

 $('.sub-nav ul').css("display","none");
    // Watch for clicks on the "slide" link.
    $('.sub-nav-btn').click(function () {
        $(this).next(".sub-nav ul").slideToggle(400);
        return false;
    });


});​

ここに画像の説明を入力

于 2012-04-29T07:37:17.293 に答える
0
$('.sub-nav ul').hide();
$('.sub-nav-btn').click(function(){
    $(this).siblings('ul').toggle('slow');
});​

フィドル

于 2012-04-29T09:07:37.357 に答える