thank you, the multiple toggle works like a charm!
Just one question: in the examples on the page we see two different kind of effect, the first one (DEMO 1) sliding from left to right, the second one (DEMO 2) sliding from top to bottom, that’s what I’d like to use, plain and simple :)
I’m using your code though, since I need multiple toggles, and I don’t know how to use the second effect. What should I change in your code to have the second effect rather than the first one?

Thank you!

I know it is a css problem and not a jQuery problem.
But please help!
p.s. i stripped this from my layout and other scripts, so dont bother the unnecessary code.

I’m trying to fix this for over 3 days already and im desperate!

If you, later, I will post the script here :)

In the first instance I need to thank you for this lovely script that you shared with us, morons :).
I managed to make this script work properly on my custom WordPress theme, but my problem is that I need an extra feature.

So I have two buttons ( coded nicely in CSS ): one is to open the content on a particular page and the other one is to close the content ( the one that closes the content is located inside the closing div, just for the record ).
I only want the button that shows the content to disappear while the proper content is loaded ( and logically to ‘come back’ when the content disappears ).
The idea here is to set somehow an extra style to the opening button ( display: none; ) when clicked and to make that extra style to disappear. I’m not a guru in JS, I barely know some basic things ( this is why posted this help-requesting comment ), but I have the starting thing :). I sure that you can come up with a better idea or at least with a solution.
I also need to mention that the whole page elements ( divs especially ) are positioned absolute from CSS ( maybe this is a important thing as well, I don’t know ).

I will be really, really thankful if you could provide me a solution to my problem as soon as possible :)

Thank you,
Sebastian

From above:
Hello,
Thanks Scott for this awesome and well explained tutorial. I’m a total newb to jQuery, but I was able to use your example to set up a simple four item horizontal nav whose links open and close their own divs.

When clicked, my four nav links open their divs according to their position in the code – link 1 is at the top, link 2 opens underneath that, link 3 opens underneath that one, etc. The problem is, if someone clicks on link 3 while div 1 and 2 are open, div 3 opens “down page” which the user cannot see. Their only clue is that the vertical scroll bar changes to indicate there is more content if you scroll down the page.

Is there a way to have the links close any currently open divs and then open it’s own div? For instance, user clicks link 1 and div 1 opens. Then they click link 2 (or 3 or 4) and div 1 closes and div 2 (or 3 or 4) opens. Can your method handle that?

I hope that makes sense. Thanks for any insight you can offer.

When clicked, my four nav links open their divs according to their position in the code – link 1 is at the top, link 2 opens underneath that, link 3 opens underneath that one, etc. The problem is, if someone clicks on link 3 while div 1 and 2 are open, div 3 opens “down page” which the user cannot see. Their only clue is that the vertical scroll bar changes to indicate there is more content if you scroll down the page.

Is there a way to have the links close any currently open divs and then open it’s own div? For instance, user clicks link 1 and div 1 opens. Then they click link 2 (or 3 or 4) and div 1 closes and div 2 (or 3 or 4) opens. Can your method handle that?

I hope that makes sense. Thanks for any insight you can offer.