Question

我目前在使用我网站的移动设备折叠导航栏时遇到问题：www.pctbu.com

当我最小化要为移动浏览器调整的窗口，并单击导航栏中的下拉选项时，弹出的子菜单不会像我希望的那样扩展导航栏。相反，它的打开方式与我网站的桌面版本完全相同。

我在functions.php文件中使用了navwalker类，它看起来像这样：

<?php
    $args = array(
        'menu' => 'header-menu',
        'menu_class' => 'nav nav-pills nav-justified navbar-inverse',
        'container' => 'false',
        'walker' => new wp_bootstrap_navwalker()
    );
    wp_nav_menu ( $args );
?>

我不确定这是否是一个已知问题，但我一直在搜索，有些人说这可能是wordpress版本高于2的问题。

如果有人能指引我走向正确的方向，我将非常感激。

提前致谢！

Answer 1

好的，我发现了这个问题。将其添加到CSS样式表

@media handheld, only screen and (max-width: 780px) {
.dropdown-menu {
position: relative;
top: 100%;
left: 0px;
z-index: 1000;
display: none;
float: none;
min-width: 160px;
padding: 5px 0px;
margin: 2px 0px 0px;
font-size: 14px;
text-align: left;
list-style: none outside none;
background-color: #FFF;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 4px;
box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.176);
}
}

这将仅针对小型平板电脑和小型手机进行修复，同时保持桌面的当前样式

使用navwalker插件的Navbar不会正确折叠子菜单

1 个答案: