NavBar Collapse not working in mdb 5 3.0.0+

Topic: NavBar Collapse not working in mdb 5 3.0.0+

jeffpfoster free asked 3 years ago

Expected behavior The collapse button expands the menu on mobile/small screens.

Actual behavior The collapse button isn't expanding the menu on mobile/small screens.

Resources (screenshots, code snippets etc.)

<!-- Navbar brand -->
          <a class="navbar-brand" href="/">
            <img
              src="img/logo.png"
              height="100"
              alt=""
              loading="lazy"
              style="margin-top: -3px;"
            />
          </a>
          <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">

The code above works on 2.2.1 but modals code isn't working there. Then move to 3.0.0+ (3.1.0 tried as well) and the code doesn't work for collapse but the modal does work.

jeffpfoster free commented 3 years ago

Further testing: I took the sample https://mdbootstrap.com/snippets/standard/mdb-lab/2820970 to take someone else's code and test it. I copied the html and then took the 3.1.0 pro version of the mdb css and js. I then shrank the browser window down and menu button came up but it was unable to be expanded.

You can test this at https://jeffpfoster.com/snippet/index.html

Add comment

Wojciech Staniszewski staff answered 3 years ago