i have the following menu:

```
<div id ="navigation-menu">
    <div id ="squaremenu">
        <ul>
            <li><a class ="homemenu" href="#Home" data-menuanchor="#Home"><img id ="homemenu" src="homemenu.bmp" height="30" width="30" /><span id="spanhome">Home</span></a></li>
            <li><a class="imprimir" href="#Servicios" data-menuanchor="#Servicios"><img id ="imprimir" src="imprimir.bmp" height="30" width="30" /><span id="spanimprimir">Imprimir</span></a></li>
            <li><a class="contacto" href="#Contacto" data-menuanchor="#Contacto"><img id="contacto" src="contacto.bmp" height="30" width="30" /><span id="spancontacto">Contacto</span></a></li>
        </ul>
    </div>
</div>

```

styled with css.

<http://jsfiddle.net/t86Vp/>

I would like if it's possible to hide most of the menu to the left and unhide it everytime i click on the menu?
If it's possible anyone can give solution with javascript/css?

Thanks in advance.

Thanks for your fast answer, i know i may not have explained myself well because english is not my main language.

Edit: What i really want is show only a portion of the menu, and everytime i clic it, then show or hide the other portion.

Once again, thanks for your fast answers

And sorry if i cant make myself clear english is not my main language.

**Solution for the people with the same problem/idea: (menu that open or close every time you click it**

Thanks to @Sergio

<http://jsfiddle.net/6xCEp/2/>