Bonjour

J avoue ne pas trop savoir où poster alors je tente ma chance ici

Mon pb est étrange, enfin pour moi.
J ai une barre de navigation avec un bouton qui permet d afficher une div menu. Cela fonctionne parfaitement.

Toutefois, et c est là l’étrangeté, les lien du menu apparaissent comme 'surlignés car sélectionnés à la souris'.
Pour y remédier je dois cliquer ailleurs dans ma page et les liens du menus s'affichent normalement.

Comme j avoue ne pas y connaitre grand chose je me suis dit qu il 'suffisait' que jquery clik ailleurs dans la page et que tout cela reviendrait dans l ordre mais non.

mon jquery
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
function ToggleMenu() {
    $('.icon-reorder').toggle();
    $('.icon-close').toggle();
 
}
$('.btn_menu').click(function () {
    $('#menu').toggle();
    $('.devider').toggle();
    ToggleMenu();
    $("html, body").animate({ scrollTop: 0 });
    $(".devider").trigger('click');
});
mon
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<nav>
        <div class="container">
            <div class="navbar">
                <div class="navbar-mobile">
                    <a class="padding-left">logo</a>
                    <span class="btn_menu"><span class="icon-reorder"></span></span>
                    <span class="btn_menu"><span class="icon-close"></span></span>
                </div>
            </div>
        </div>
    </nav>
 
 
    <div id="menu">
        <a href="#">Fonctionnement</a>
        <a href="#">Bilan</a>
        <a href="#">Inscription</a>
        <a href="#">Connexion</a>
        <a href="#"><img src="assets/img/flags/enr.png" class="flag-menu" width="24" alt="EN">English</a>
        <a href="#"><img src="assets/img/flags/frr.png" class="flag-menu" width="24" alt="EN">Français</a>
        <br />
    </div>

mon
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
#menu a:link,a:visited,a:active {
    padding: 1em;
    padding-bottom: 0.5em;
    display: block;
    color: #0f1923;
    text-decoration: none;
    text-transform: uppercase
}
#menu a:hover {
    color:black
}

merci de votre aide