Mobile Menu Doesn\'t Close/Hide with Selection


Topic: Mobile Menu Doesn\'t Close/Hide with Selection

normduquette pro asked 7 years ago

On mobile device, menu does not close after selecting item.Example: click hamburger menu, tap item, menu stays open - need to tap hamburger again to hide menu.

rl pro answered 7 years ago

I think this is "by design" from bootstrap - check at https://getbootstrap.com/docs/4.0/components/navbar/ I solved this by $('.navbar-collapse').removeClass('show') on click events of menu items.

normduquette pro commented 7 years ago

Thanks, I got it to work I tried one way and then tried your method, both worked the same: To help others out, just add one of the following methods between the script tags at the bottom of the page <pre>//close mobile menu on click - method 1 $('.navbar-nav>li>a').on('click', function(){ $('.navbar-collapse').collapse('hide'); }); //close mobile menu on click - method 2 $('.navbar-nav>li>a').on('click', function(){ $('.navbar-collapse').removeClass('show'); });</pre>

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: Other
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No