单击切换按钮时,我在标题和移动设备上有两个菜单,出现两个菜单,但在顶部出现一个菜单。我想在单击切换按钮时将这两个菜单合并为一个,希望同时看到两个菜单。
我已检查此主题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/