Question

I’m trying to make a navigation where there are 4 clickable links. Those links will then drop-down a menu and display content, note that the content is not directly under the links in the code. Here is an image of how it currently looks like:

I need jQuery to make it slidetoggle down when clicking any of the links (Ladies, Men, Junior, Stores). I got that working so far, however when clicking the other three (while the first is active) shouldn’t make it go back up and instead display the content of that specific nav link and hide the previous clicked link’ content.

e.g. clicking Men while previously having clicked ladies will set display none on the ladies content and will display the men’ content instead. So the navigation should only slide back up when the same navigation unit is clicked twice (first to activate, second to close).

Demo: http://jsfiddle.net/Malachute/yxC8L/

If possible, it should also .addClass to the current active navigation link. What would the jQuery code for this be? Thanks in advance.

Answer 1

I hope I understood your question, I altered the fiddle, please tell me if that is wished behaviour:)
If not I will try to help again:)
Here is the fiddle