Soucis avec un menu HTML et JS.

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Soucis avec un menu HTML et JS.

snowden

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. »

Publicité

MaybeEijOrNot

but someone at least

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.

snowden

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. »

FORUM HardWare.fr

Programmation

HTML/CSS

Soucis avec un menu HTML et JS.

Sujets relatifs
[OpenAPI - Maven] Generation HTML depuis yaml OAS 3	html style recursif
interface utilisateur modifiant contenu HTML et CSS	[html] fonction scroll
besoin d'aide sur blogger et menu deroulant a plusieurs niveaux	[React/JS] Actualiser image dans le front
Afficher flux http dans page html	Ombre portée sur menu déroulant
Menu en MVVM C#	Aggrandir une image de Portfolio en cliquant / JS
Plus de sujets relatifs à : Soucis avec un menu HTML et JS.

Page générée en 0.080 secondes