Joomla Bootstrap自定义模板中的移动菜单未关闭

Question

I built a Joomla template to redesign my company's website's front end. Everything works and it looks nicely. My only problem now is the mobile menu. It opens up when you click the menu button, but it doesn't close. The only way to get rid of it is to select a link or refresh the page.

I know the issue is Joomla uses a custom version of Bootstrap.js but if I include my own standard Bootstrap.js file then everything stops working because conflicting calls to JavaScript happen.

Does anything know of a solution to this?

The website is www.DriveAndShine.com

Answer 1

<div id="navbar" style="height: 456px; background-color: rgb(17, 3, 140);" 
  class="navbar-collapse collapse **in**">

class in looks like not removed when you reclicked the menu you can use jQuery hasClass method for #navbar ( please include jquery before running the code )

if($('#navbar').hasClass('in')) {
   $('#navbar').removeClass('in');
} else {
   $('#navbar').addClass('in');
}