Soucis avec un menu HTML et JS.

Marsh Posté le 05-04-2020 à 17:50:02

Bonjour,

Je rencontre un petit soucis que je n'arrive pas à résoudre.

Lorsque je clique sur un lien du menu, ça me renvoi bien dans le bon "id". Cependant, le menu ne se ferme pas
Je le vois le bon "id" car mon css est en transparence.

Sauriez-vous m'aider svp ?

Merci par avance.

Code HTML :

Code :

<div id="menu-burger">
<span class="menu-icon"></span>
</div>
<div id="overlay-menu">
<nav role='navigation'>
<ul>
<li><a href="#aaaa">aaaa</a></li>
<li><a href="#bbbb">bbbb</a></li>
<li><a href="#cccc">cccc</a></li>
<li><a href="#dddd">dddd</a></li>
<li><a href="mailto:moi@moi.com">Contact</a></li>
</ul>
</nav>
</div>

Code JS :

Code :

$('#menu-burger').click(function() {
var overlayMenu = $('#overlay-menu'),
menuIconLines = $('#menu-burger .menu-icon'),
menuBurger = $('#menu-burger');
if(overlayMenu.hasClass('open')) {
overlayMenu.removeClass('open');
menuIconLines.removeClass('open');
menuBurger.removeClass('open');
}else{ overlayMenu.addClass('open');
menuIconLines.addClass('open');
menuBurger.addClass('open');
};
})

---------------
« A l’origine de toute erreur attribuée à l’ordinateur, vous trouverez au moins deux erreurs humaines. Dont celle consistant à attribuer l’erreur à l’ordinateur. »

Reply

Marsh Posté le 05-04-2020 à 17:50:02

Reply

Marsh Posté le 05-04-2020 à 19:26:59

Bonjour,

Manque le CSS + ceci est bizarre :

Code :

menuBurger.removeClass('open');

Mais tu as attaché ton évènement de 'click' dessus, donc une fois qu'il sera caché tu ne pourras plus cliquer dessus. :pt1cable:

Message édité par MaybeEijOrNot le 05-04-2020 à 19:27:31

---------------
C'est en écrivant n'importe quoi qu'on devient n'importe qui.

Reply

Marsh Posté le 05-04-2020 à 19:28:43

J'ai finalement réussi à ce que ça fonctionne.
J'avais oublié dans mon premier post de mettre mes tentatives sur le script de fermeture, désolé.

Code :

// Ouverture du menu
$('#menu-burger').click(function() {
var overlayMenu = $('#overlay-menu'),
menuIconLines = $('#menu-burger .menu-icon'),
menuBurger = $('#menu-burger');
if(overlayMenu.hasClass('open')) {
overlayMenu.removeClass('open');
menuIconLines.removeClass('open');
menuBurger.removeClass('open');
}else{ overlayMenu.addClass('open');
menuIconLines.addClass('open');
menuBurger.addClass('open');
};
})
// Fermeture du menu après avoir cliqué sur un lien
$( '#overlay-menu nav ul li a' ).on("click", function(){
$('#menu-burger').click();
});

---------------
« A l’origine de toute erreur attribuée à l’ordinateur, vous trouverez au moins deux erreurs humaines. Dont celle consistant à attribuer l’erreur à l’ordinateur. »

Reply

Soucis avec un menu HTML et JS.

Sujets relatifs:

Leave a Replay