Wordpress 导航栏响应不显示

Question

我正在尝试在我的网站上修复一个标题，所有的东西都很好，除了当我缩小浏览器时，主菜单在开始时下降到一个按钮（如预期的那样）不显示内容导航栏，但是现在，按钮总是显示内容，点击时不会隐藏。

代码是：

    <!-- mainmenu begin -->
    <div class="de_menu collapse navbar-collapse">
        <div id="mainmenu" class="mainmenu">
            <!-- mainmenu begin -->
            <?php
            $primarymenu = array(
                'theme_location'  => 'primary',
                'menu'            => 'primary',
                'container'       => 'false',
                'container_class' => 'collapse navbar-collapse',
                'container_id'    => '',
                'menu_class'      => 'nav navbar-nav',
                'menu_id'         => '',
                'echo'            => true,
                'fallback_cb'     => 'wp_bootstrap_navwalker::fallback',
                'walker'          => new wp_bootstrap_navwalker(),
                'before'          => '',
                'after'           => '',
                'link_before'     => '',
                'link_after'      => '',
                'items_wrap'      => '<ul data-breakpoint="800" id="%1$s" class="%2$s">%3$s</ul>',
                'depth'           => 2,
            );
            if ( has_nav_menu( 'primary' ) ) {
                wp_nav_menu( $primarymenu );
            }
            ?>
            <!-- mainmenu close -->
        </div>
    </div>

这是浏览器中的代码：

    <!-- mainmenu begin -->
    <div class="de_menu  collapse navbar-collapse">
        <div id="mainmenu" class="mainmenu">
            <!-- mainmenu begin -->
            <ul data-breakpoint="800" id="menu-menu-principal" class="nav navbar-nav">
<li id="menu-item-26" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-26 active">First Option</li>
<li id="menu-item-27" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-27">Second option</li>
<li id="menu-item-28" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-28 ">Third Option</a>
<ul role="menu" class=" dropdown-menu">
<li id="menu-item-31" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-31">First Child</li>
<li id="menu-item-30" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-30">Second Child</li>
<li id="menu-item-29" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-29">Third Child></li>
</ul>
</li>
<li id="menu-item-32" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-32">Fourth Option</li>
<li id="menu-item-33" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-33">Fifth Option</li>
</ul>            
<!-- mainmenu close -->
        </div>
    </div>

我已经尽力了，但我不知道如何解决它。

Answer 1

使用此滑动切换功能

<script type="text/javascript">
    jQuery( document ).ready(function() {
    jQuery(".dl-trigger").click(function(e){
        e.preventDefault();
        jQuery(".dl-menu").slideToggle(150);
            })
    });
</script>