单击切换按钮时,我在标题和移动设备上有两个菜单,出现两个菜单,但在顶部出现一个菜单。我想在单击切换按钮时将这两个菜单合并为一个,希望同时看到两个菜单。
我已检查此主题Combining multiple Bootstrap menus into one for mobile?,但不适用于我

<nav class="topmenu">
    <?php
        wp_nav_menu( array('menu' => 'top-menu','theme_location'=> 'topmenu','depth'=> 2,'container'=> 'div','container_class'=> 'collapse navbar-collapse navbar-ex1-collapse','fallback_cb'=>'wp_bootstrap_navwalker::fallback','walker'=> new wp_bootstrap_navwalker()));
    ?>
</nav>



<nav class="mainmenu">
    <!-- Brand and toggle get grouped for better mobile display -->
        <div>
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
            <?php
                wp_nav_menu( array('menu' => 'main-menu','theme_location'=> 'main-menu','depth'=> 2,'container'=> 'div','container_class' => 'collapse navbar-collapse navbar-ex1-collapse', 'fallback_cb'=> 'wp_bootstrap_navwalker::fallback','walker' => new wp_bootstrap_navwalker()));
            ?>
       </div>
</nav>

最佳答案

对于那些有此问题的人,我无法通过引导程序更改来解决,但是使用一个简单的jQuery代码就可以解决。
单击切换按钮时,只需要将第一个导航元素移到另一个导航元素

$(function() {
        $(".navbar-toggle").click(
            function(){ $(".topmenu").appendTo(".mainmenu"); }
        );
    });

关于html - 如何将主要和辅助 bootstrap wp菜单合并为一个移动设备,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/55160272/

10-12 01:40
查看更多