Topic: Dropdown not working
Dear Community
I have a problem which I hope you can solve.
- ● The Navbar profile picture should provide a dropdown
- ● The Navbar should open up when you click it in mobile version
None of the above happen. You can test it out yourself: http://blogg.bplaced.net/
Here is my Navbar code:
<header>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top">
<div class="container-fluid">
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarExample01"
aria-controls="navbarExample01"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarExample01">
<a class="navbar-brand" href="/">
<img src="img/favicon.png" height="30" alt="Logo" loading="lazy"/>
</a>
<ul class="navbar-nav mr-auto mb-2 mb-lg-0">
<li class="nav-item active">
<a class="nav-link active" aria-current="page" href="/">Startseite</a>
</li>
<li class="nav-item">
<a class="nav-link" href="registration">Registrieren</a>
</li>
<li class="nav-item">
<a class="nav-link" href="login">Anmelden</a>
</li>
<li class="nav-item">
<a class="nav-link" href="blogs.php">Blogs</a>
</li>
<li class="nav-item">
<a class="nav-link" href="account">Konto</a>
</li>
</ul>
<ul class="navbar-nav d-flex flex-row">
<!-- Avatar -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-expanded="false">
<img src="https://mdbootstrap.com/img/Photos/Avatars/img (31).jpg" class="rounded-circle" height="22" alt="profile" loading="lazy"/>
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<li><a class="dropdown-item" href="account">Mein Profil</a></li>
<li><a class="dropdown-item" href="settings">Settings</a></li>
<li><a class="dropdown-item" href="#">Logout</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<!-- Navbar -->
</header>
Open
- User: Free
- Premium support: No
- Technology: MDB 5
- MDB Version: -
- Device: Fujitsu Esprimo C710
- Browser: Chrome 84.0.4147.105
- OS: Windows 10 2004
- Provided sample code: No
- Provided link: Yes
Mikołaj Smoleński staff commented 8 months ago
As I can see You don't import any MDB JS file, which is necessary for dropdown and other advanced components. Please add js file to your project and check it again. Best regards