Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Oct 2006
    Posts
    197
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Jquery Toggle Question

    Im using the toggle script demonstrated here:
    http://www.sohtanaka.com/web-design/examples/toggle/

    It works perfectly, but im wondering if it is possible to have a button to expand all and contract all.

    Ive been reading through this page: http://api.jquery.com/toggle/

    Im having a hard time understanding it, because this is one of the first things I have worked on with jquery. Can anyone help explain how I can do this?

  • #2
    Regular Coder
    Join Date
    May 2008
    Posts
    135
    Thanks
    13
    Thanked 10 Times in 10 Posts
    Code:
    $(document).ready(function(){
    
    $("h2.trigger").click(function(){
    	$(".toggle_container").slideToggle("slow,");
    });
    
    
    })
    using the code from the website you shown this would make all containers open close whenever a h2 is clicked. you can change what calls it by changing this bit

    Code:
    $("h2.trigger")
    to whatever your button class or id is

    i.e

    Code:
    $(document).ready(function(){
    
    $(".toggler").click(function(){
    	$(".toggle_container").slideToggle("slow,");
    });
    
    
    })

    so you would give a link with a class of toggler, this would then toggle the divs to open or close.

  • #3
    Regular Coder
    Join Date
    Oct 2006
    Posts
    197
    Thanks
    9
    Thanked 0 Times in 0 Posts
    I would need it to expand all / contact all with one click of the button though, currently it only works one at a time.

  • #4
    Regular Coder
    Join Date
    May 2008
    Posts
    135
    Thanks
    13
    Thanked 10 Times in 10 Posts
    i wrote this above, sorry i may not of been clear.

    Code:
    $(document).ready(function(){
    
    $("YOUR BUTTON CLASS OR ID").click(function(){
    	$(".toggle_container").slideToggle("slow");
    });
    
    
    })


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •