Question

我偶然发现了一个问题，我无法关闭移动导航菜单。

我正在使用jQuery Full Page作为我的前端。点击后会打开我的手机菜单：

<nav class="menu col-xs-4 pull-right">
  <a href="#">
    <span>Menu</span>
    <button>
      <span>toggle menu</span>
    </button>
  </a>
</nav>

使用jQuery代码：

$('nav, .mobile-menu--close').click(function(e){
    $('body').toggleClass('menu-open');
});

但它在关闭.mobile-menu - close

时没有任何作用

<a href="#" class="mobile-menu--close">
  <span>Close</span>
  <span class="mobile-menu--close-x"></span>
</a>

它位于主要

之外的旁边元素内

    ...        
    <div class="background-image landing-mantas col-xs-8 pull-right">
        </div>
      </div>
    </div>
  </main>
  <aside class="mobile-menu">
    <ul>
      <li>
        <a href="#">Homepage</a>
      </li>
      <li>...

使用移动开放课程，它可以将X 100％翻译成一部分并将其移至一边。移动菜单从X100％降至0％。所以基本上它将这些与职位交换。

我已经阅读了禁用触摸操作的答案：无等等。没有什么似乎有帮助。

可以找到完整的网络预览here

请记住，这是wop所以请在响应式视图中查看它以获得重点。但它应该做到这一点。

Answer 1

删除此样式并尝试

   .mobile-menu {
         z-index: -1; 
    }

Answer 2

正如我从您提供的链接中看到的那样。当应用菜单打开时，您的导航不可点击，因此您需要将菜单开放的z-index设置为高于您内容的z-index（我假设该页面位于内容中）（）） -

.menu-open{
 z-index: 1111;
}
.content{
z-index: 1000;
}

jQuery +整页+移动菜单关闭=无法阻止被动事件监听器内的默认

2 个答案: