Question

我有一个响应的菜单，但我遇到的问题是当它重新调整大小时，单击时菜单不会下拉。我添加了codepen。不要担心3行没有出现，他们会在实际网站上进行。

菜单代码

<label for="show-menu" class="show-menu"><i class="fa fa-bars fa-2x"></i></label>
   <input type="checkbox" id="show-menu" role="button">
        <nav class="cl-effect-4">
        <ul id = "nav" class="cl-effect-4">
            <li><a href="index.php?page=work">WORK</a><span class="slash-size">/</span></li>
            <li><a href="index.php?page=about">ABOUT</a>
        </ul>
        </nav>

提前致谢

Answer 1

您需要使用javascript来处理菜单的打开和关闭。如果你可以使用jquery，添加如下内容：

$('.show-menu').click(function() {
    $('#nav').toggle();
})

编辑：啊现在我看到你想利用复选框css技巧来显示/隐藏你的菜单。将input[type=checkbox]:checked ~ #nav{更改为input[type=checkbox]:checked ~ nav #nav{

响应式菜单问题 - 点击后无法打开

1 个答案: