我创建了一个slidetoggle整页下拉菜单,我正在尝试在其中添加我已注册的wordpress菜单,但我无法看到列表项目,因为它们背后的框是在点击汉堡包图标显示之前?
</head>
<body>
<div class="container">
<header class="header-wrapper">
<h1 class="logo-text">Sell Garrard 301</h1>
<div class="hamburger-helper">
<div id="menu-toggle">
<div id="hamburger">
<span></span>
<span></span>
<span></span>
</div>
<div id="cross">
<span></span>
<span></span>
</div>
</div>
</div>
<nav class="menu-hide">
<?php
wp_nav_menu( array(
'theme_location' => 'header_menu',
'container' => '',
'container_class' => 'menu-hidden',
'menu_class' => 'menu-hide',
'menu_id' => 'header_menu',
) );
?>
</nav>
</header>
我用来隐藏下拉列表的CSS如下
.menu-hide {
background-color: #666;
width: 100%;
height: 0px;
-webkit-transition: height 0.5s linear;
-moz-transition: height 0.5s linear;
-ms-transition: height 0.5s linear;
-o-transition: height 0.5s linear;
transition: height 0.5s linear;
}
.menu-hide.menu-open {
background-color: #666;
width: 100%;
height: calc(100vh - 70px);
-webkit-transition: height 0.5s linear;
-moz-transition: height 0.5s linear;
-ms-transition: height 0.5s linear;
-o-transition: height 0.5s linear;
transition: height 0.5s linear;
}
我基本上想要使用滑动切换功能嵌套导航中的任何菜单列表项,使用类菜单隐藏,以便在单击汉堡菜单图标时它们具有相同的滑动效果。列表项仍然在标题
下可见我知道这很模糊,但我用Google搜索了几个小时,没有发现任何相关的东西,只需指向正确的方向
由于