recently I was looking for the solution with the "navbar" issues which i faced. On mobile version navbar links do not closed the menu. Now I find the super awesome people who managed for another person similar problem. ( almost identical but I cant understand why it is not working for me. I am lame with a code maybe I missing some thing. So asking you for help. Link to the similar issue: Hide Twitter Bootstrap nav collapse on click
So I've fixed the similar issue with menu links which was not closing the menu bar. But now I can see that in desktop version my menu "navbar" acting really strange. then pressing any link in the menu bar I can see that the menu trying to close it self or do something like that. and it looks really undesirable.
I've tried to add on to the code line ".in" ending to the target but It do not helped. It still trying to close or closing the menu bar in the mobile version at all.
Currently on let say production site I've left it with a standar links for a desktop as I do not want to show it for clients with such broken menu. http://scorpion3d.com/ On the prod no major changes has been done.
So basically trying to fix it locally, This is a code for menu block:
<!-- Menu Block -->
<div class="menu-block">
<!-- Container -->
<div class="container">
<!-- Ownavigation -->
<nav class="navbar ownavigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><span><img src="assets/images/logo.png" alt="logo" height="50" width="50"></span>Scorpion3D</a>
</div>
<div id="navbar" class="navbar-collapse collapse" data-toggle="collapse" data-target="#navbar">
<ul class="nav navbar-nav">
<li class="active">
<a href="#top" title="PRADŽIA" type="button" data-toggle="collapse" data-target="#navbar">PRADŽIA</a></li>
<li><a href="#Paslaugos" title="PRADŽIA" type="button" data-toggle="collapse" data-target="#navbar" aria-expanded="false">PASLAUGOS</a></li>
<li><a href="#pricing-section" title="KAINORAŠTIS" type="button" data-toggle="collapse" data-target="#navbar" aria-expanded="false">KAINORAŠTIS</a></li>
<li><a href="#team-section" title="APIE MUS" type="button" data-toggle="collapse" data-target="#navbar" aria-expanded="false">APIE MUS</a></li>
<li><a href="#footer-main" title="KONTAKTAI" type="button" data-toggle="collapse" data-target=".navbar" aria-expanded="false">KONTAKTAI</a></li>
<!-- Collapse Menu Buttons -->
<div class="collapse" id="navbar"></div>
</ul>
</div>
<div id="loginpanel" class="desktop-hide">
<div class="right" id="toggle">
<a id="slideit" href="#slidepanel"><i class="fo-icons fa fa-inbox"></i></a>
<a id="closeit" href="#slidepanel"><i class="fo-icons fa fa-close"></i></a>
</div>
</div>
</nav><!-- Ownavigation /- -->
</div><!-- Container /- -->
</div><!-- Menu Block /- -->
With this code I can achieve the menu closing in the mobile version. But from the desktop perspective menu is damaged it trying to close and open again acting weird. So please if you guys can see where I did mistake please let me know.