Menu de navbar qui disparait

Par ToinouPHP, il y a 5 ans

Javascript

Bonjour, pour un exercice dans ma formation, je dois créer un site web pour une association fictive.

J'y utilise Bootstrap et le problème est dans ma navbar :
En mode mobile, lorsque je clique sur les 3 lignes du menu ( Pour faire apparaitre le menu de la navbar ), le menu apparait pendant 1s, puis disparait et je ne comprend pas. ( Il semblerait que j'ai toujours été nul pour les navbars. >< )

Si quelqu'un pouvait m'aiguiller, ça m'aiderais beaucoup !

Mon code :

<nav class="navbar navbar-expand-lg navbar-dark bg-dark"> <a class="navbar-brand" href="index.php" id="brand"> <img src="assets/img/feather.png" alt="logo" style="width: 30px"> Charmed Plume Productions</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"> <li class="nav-item" id="li_accueil"> <a class="nav-link" href="#" id="see_accueil">Accueil <span class="sr-only">(current)</span></a> </li> <li class="nav-item" id="li_whoarewe"> <a class="nav-link" href="#" id="see_whoarewe">Qui sommes nous ?</a> </li> <li class="nav-item" id="li_event"> <a class="nav-link" href="#" id="see_futur-events_navbar">Evenements</a> </li> </ul> </div> </nav>

5 réponses

Aecy, il y a 5 ans

Bonjour,

As-tu bien importé le js de bootstrap ainsi que le reste ?

ToinouPHP, il y a 5 ans

Je viens d'ajouter bootstrap et jquery, ça fonctionne, mais y a toujours cet espece de "clignotement", quand je l'ouvre, ça s'ouvre, ça disparait puis ça réapparait. Mais le menu fonctionne, hormis ça.

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
ToinouPHP, il y a 5 ans

j´ai aussi démenagé haha
et oui le soucis est toujours présent

Aecy, il y a 5 ans

Désolé, j'ai déménagé aha.

Le soucis est toujours présent ?

BurnItAll, il y a 5 ans

Salut,

As-tu declaré d'autres elements dans ta page avec la règle css "z-index"?
Peut-être que le composant "nav-bar" de bootstrap applique dynamiquement des règles d'index ce qui peut provoquer des effets indésirables, du fait qu'il "traverse" le DOM jusqu'à être à son index le plus élévé?