移动版本中的Bootstrap nav walker下拉菜单折叠整个菜单

时间:2016-05-16 21:12:53

标签: twitter-bootstrap

我使用Nav Walker和Bootstrap 3.0输出主导航菜单,其结构大致如下:

  • 顶级项目
    • 次要项目
    • 次要项目
  • 顶级项目
    • 次要项目
    • 次要项目

等等。桌面版本工作正常。在移动版本上,button.navbar-toggle可以很好地打开顶级菜单,但是当我点击具有子菜单的顶级项目时,子菜单会展开,但也会折叠顶级菜单。

导航器和导航栏默认代码:

<nav class="navbar navbar-default" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#main-nav" aria-expanded="false">
                    <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="<?php bloginfo('url'); ?>">
                    <img src="<?php bloginfo('url'); ?>/wp-content/themes/vanilla_3/assets/images/logotype.png" class="hidden-xs" alt="Caring4Connor">
                    <img src="<?php bloginfo('url'); ?>/wp-content/themes/vanilla_3/assets/images/logotype-xs.png" class="visible-xs-inline-block" alt="Caring4Connor">
                </a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <?php
                wp_nav_menu( array(
                    'menu'              => 'primary',
                    'theme_location'    => 'primary',
                    'depth'             => 2,
                    'container'         => 'div',
                    'container_class'   => 'collapse navbar-collapse',
                    'container_id'      => 'main-nav',
                    'menu_class'        => 'nav navbar-nav',
                    'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                    'walker'            => new wp_bootstrap_navwalker())
                );
            ?>

        </div>
    </nav>

我已经挖掘了代码并与工作示例进行了比较,但我似乎无法找到导致此问题的任何内容!

0 个答案:

没有答案