Bootstrap – problem z implementacją rozwijanego menu

0

Witam,

Mam problem, uczę się bootstrapa i chciałem zrobić menu rozwijane które niestety nie działa... siedzę nad tym już którąś godzinę szukałem literówek itp.. i nie wiedzę błędu.

Kod wygląda następująco.

<header>
	
<nav class="navbar navbar-dark bg-primary navbar-expand-md">
			
<a class="navbar-brand" href="#"><img src="img/logo.png" width="30" height="30" class="d-inline-block mr-1 align-bottom" alt=""> MyWeb.pl</a>
		
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#mainmenu">
<span class="navbar-toggler-icon"></span>
</button>
			
<div class="collapse navbar-collapse" id="mainmenu">
						
Nie działa
						
</div>
			
</nav>
	
	
</header>

Co jest z tym nie tak?

Pozdrawiam.

2

Wklej może trochę więcej kodu, bo tutaj nie widzę w żaden sposób odwołania do BS ani jakichkolwiek innych stylów czy chociażby JS'ów. Być może problem w tym leży, że błędnie podpinasz BS do projektu?

2

Doszedłem – najprawdopodobniej albo źle podłączasz, albo w ogóle nie podłączasz dwóch rzeczy, i to dokładnie w tej kolejności:

  1. Najpierw jQuery
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
  1. a potem pliki JS Bootstrapa
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

Źródło: https://getbootstrap.com/docs/4.0/getting-started/introduction/#js

Cytat:

Many of our components require the use of JavaScript to function. Specifically, they require jQuery, Popper.js, and our own JavaScript plugins.

Działający kod (po podłączeniu plików; widać je z lewej strony w panelu): https://jsfiddle.net/1ac8gw5f/1/

PS. Nie wiem, czy wpływ na kolejność podłączania ma także sam plik CSS Bootstrapa (którego tu nie uwzględniłem) – zobacz to sam.

2

Dziękuję za szybkie odpowiedzi, po waszych sugestiach przyjrzałem się <script> i faktycznie brakowało jednego (bootstrap.js). Po dodaniu wszystko już działa.

Bardzo dziękuję za pomoc i za wytyczenie newbie drogi z błędem.

Pozdrawiam

1 użytkowników online, w tym zalogowanych: 0, gości: 1