Bonjour,

J'ai un menu en html/css auquel j'aimerais bien y ajouter du jquery. Pour y ajouter une couleur de fond lorqu'on clique sur un bouton.

J'ai utilisé addClass sur les liens de mon menu mais cela ne fonctionne pas. Je vois le fond pendant 1s et après plus rien. Quelqu'un aurait-il une idée ?

Je tiens à préciser que j'utilise des "include_once" en php pour mon menu. Peut-être que cela viens de la ?

D'avance merci

Mon code Jquery

$(document).ready(function(){
    $("#cssmenu ul li a").click(function(){
        $("li a").removeClass("active");
        $(this).addClass("active");
    });
});

Mon code CSS

/*#cssmenu > ul > li.active > a,*/
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li > a:hover {
    color: #ffffff;
}
#cssmenu > ul > li > a:after {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: -1;
    width: 100%;
    height: 120%;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    content: "";
    -webkit-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
    -webkit-transform: perspective(5px) rotateX(2deg);
    -webkit-transform-origin: bottom;
    -moz-transform: perspective(5px) rotateX(2deg);
    -moz-transform-origin: bottom;
    transform: perspective(5px) rotateX(2deg);
    transform-origin: bottom;
}

#cssmenu > ul > li:hover > a:after,
#cssmenu > ul > li > a:hover:after {
    background: #57b846;
}

.active > ul > li > a:after{
    background-color: red;
    color: white;
}

Et mon code html de mon menu

<div id='cssmenu'>
    <ul>
        <li><a href='acceuil.php'>Acceuil</a></li>
        <li><a href='newloss.php'>Ajouter une nouvelle chute</a></li>
        <li><a href='find.php'>Chercher une chute</a></li>
        <li><a href='use.php'>Utiliser une chute</a></li>
        <li><a href='changerack.php'>Changer le rack d'une chute</a></li>
        <li><a href='print.php'>Imprimer une étiquette</a></li>
        <li><a href='logout.php'>Déconnexion</a></li>
    </ul>
</div>