Problème menu hamburger

Bonjour à tous,

je débute dans le web et j'ai un souci dans la mise en place de mon menu hamburger. Tout marche (icône/ menu caché) mais au moment de le faire réapparaitre (js) ça ne fonctionne pas (la width__sidebar n'apparait pas dans le body). Ma page js est bien reliée à mon site (test ok). Je vous met le code pour que ce soit plus compréhensible. Merci d'avance!

mon html:

<div id="main">
<a href="#" class="main__icon" id="main__icon"></a>
<h1><a href="index.html">Travel Mag</a></h1>
<ul id="menu">
<li><a href="index.html">Home</a></li>
<li><a href="index.html#un">Articles</li>
<li><a href="#apropos">About</a></li>
<li class="last"><a href="shop.html#mainshop">Shop</a></li>
</ul>

mon css:

@media screen and (max-width: 768px){

#main {
width:336px; 
height:2905px;}

h1 {
float:left; 
margin-top:20px;
padding-left:15px;}

.main__icon {
display:block; 
width:50px; 
height:50px; 
background-color:#ff0000; 
position:relative; 
float:left; 
cursor:pointer;}

.main__icon::after {
content:''; 
position:absolute; 
display:block; 
width:16px; 
height:0px; 
box-shadow: 0 10px 0 1px #ffffff, 0 16px 0 1px #ffffff, 0 22px 0 1px #ffffff; top:8px; left:15px;}

#menu {
position: absolute; 
left:0; top:0; bottom:0; margin-top:0px; padding-right:0px; width:250px;  background-color:#ff0000;
transform: translateX(-250px);} }

mon js:

(function($){

    /* Quand je clique sur l'icône hamburger je rajoute une classe au body */
    $('#main__icon').click(function(e){
        e.preventDefault();
        $('body').toggleClass('with--sidebar');
    });

    /* Je veux pouvoir masquer le menu si on clique sur le cache */
    $('#site-cache').click(function(e){
        $('body').removeClass('with--sidebar');
    })

})(jQuery);

Modifié par Anna01 (05 Jun 2016 - 20:30)

Bonjour Anna01 !

Tu peux utiliser .toogleClass() pour les deux fonctions me semble-t-il.

Sinon je ne trouve pas la balise HTML avec l'id "#site-cache" utilisé dans ton JS.

Sinon petite remarque si je puis me permettre, tu utilises beaucoup de positions "absolute" et à mon avis tu pourrais probablement te débrouiller autrement pour afficher ton menu. Ca risque de te poser de nombreux problèmes par la suite.