具有引导程序3的移动多级（3）菜单

Question

我需要一些关于bootstrap 3上的多级菜单构建的帮助。我在堆栈上找到了一些示例如何构建3级导航菜单，并且所有工作正常但仅在桌面上 - 在移动设备上他们不...我正在尝试构建的菜单将仅用于移动设备 - 这就是为什么我需要一些帮助。

这是我的引导代码：

  <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>

感谢您的帮助！