开发者

Toggle block in jQuery

开发者 https://www.devze.com 2022-12-28 07:27 出处:网络
I\'d like to click a header link and have the block directly underneath hide or show (with slideToggle)

I'd like to click a header link and have the block directly underneath hide or show (with slideToggle)

Thanks

<div class='header'><a href='#'>Header</a></div>

<div class='block'>
<div class='test>Some Text</div>
<div class='test>Some Text</div>
<div class='test>Some Text</div>
</div>

<div class='header'><a href='#'>Header</a></div>

<div class='block'>
<div class='test>Some Text</div>
<div class='t开发者_JAVA技巧est>Some Text</div>
<div class='test>Some Text</div>
</div>

<div class='header'><a href='#'>Header</a></div>

<div class='block'>
<div class='test>Some Text</div>
<div class='test>Some Text</div>
<div class='test>Some Text</div>
</div>


Try this:

$(function(){
  $('.header a').click(function(){
    $(this).parent().next().slideToggle();
  });
});


Something like this should work:

$("DIV.header A").click(function(){$(this).parent().next().slideToggle();});


$(function()
{
    $(".header").click(function()
    {
        $(this).next().toggle();
    });
});

Or if you want a sliding toggle try:

$(function()
{
    $(".header").click(function()
    {
        $(this).next().slideToggle();
    });
});


$('.header').click(function(){
  $(this).next(".block").slideToggle("slow", function(){
         $(".block").not(this).slideUp("slow");
   });
}); 

This code can help to solve your problem.

0

精彩评论

暂无评论...
验证码 换一张
取 消