I need some help with multi-level menu build on bootstrap 3. I found on stack some examples how to build 3 level navigation menu, and all work ok but only on desktop - on mobile devices they don't... The menu which i'm trying to build will be used only on mobile - that why I'm need some help.
Here is my bootstrap code:
<nav id="myNavbar" class="navbar navbar-default" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<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="#">TITLE</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="#">ABOUT</a></li>
<li><a href="#">KOLECTION</a></li>
<li class="dropdown">
<a href="#" data-toggle="dropdown" class="dropdown-toggle">PRODUCTS <b class="caret"></b></a>
<ul class="dropdown-menu">
<li class="dropdown">
<a href="#" data-toggle="dropdown" class="dropdown-toggle">STUFF 1 <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Product one</a></li>
<li><a href="#">Product two</a></li>
</ul>
</li>
<li><a href="#">STUFF 2</a></li>
<li><a href="#">STUFF 3</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
Thanks for any help!