Question

So I have this menu and when I click on a button I need to create another div under the menu. I have done that. But when I click on another button on the menu that div is still there and I want it to dissapear/collapse. So how should I do it? What I found until now is how to hide a div when clicking on a specific show/hide button, but I need to hide that div when I click any button on my page…

Any help is highly appreciated.

My code is this but I don’t think it is relevant (I am interested in the process, how should I do it):

<div id="container">
        <ul id="nav">
            <li><a href="#" id="home">Despre noi</a></li>
            <li><a href="#" id="Projects">Projects</a></li>
            <li><a href="#" id="photos">Implica-te</a></li>
            <li><a href="#">Stiri</a></li>
            <li><a href="http://localhost/ong/contact/contact.html" id="contact">Contact</a></li>
        </ul>
</div>

So this is my menu and when I click on projects this div shows up

<div id="menu_lava">

    </div>

which is a lavalamp submenu. But how can I make it to collapse when I click on other buttons on my main menu?

Answer 1

Hide all info-div’s on a click and just show the sepcific one:
Here’s a jsfiddle (using jQuery):

http://jsfiddle.net/FKeAF/1/