如何在点击菜单项时隐藏手机中的菜单？答案

【问题标题】：How to hide the menu in mobile on click on the menu item?如何在点击菜单项时隐藏手机中的菜单？
【发布时间】：2018-06-09 15:41:18
【问题描述】：

我有一个单页网站。我有一个平滑滚动的菜单。当用户单击服务时，它将以平滑滚动的方式定位服务部分。桌面没有问题。

让我们谈谈移动

在移动设备中，菜单显示如下

当我点击汉堡图标时，它会像这样显示

现在问题在于平滑滚动。当我点击服务时，它以平滑滚动的方式定位服务部分，但菜单仍显示在移动设备上。

当我点击菜单时，我必须隐藏菜单。

你可以查看我的[code here][3] https://jsfiddle.net/vqpyt5co/

【问题讨论】：

标签： javascript jquery html css media-queries

【解决方案1】：

添加以下代码触发关闭下拉菜单的点击事件。

if ($(".x_mark_img").is(":visible")) {
    $(".x_mark_img").click();
}

查看更新的fiddle

$(function() {
    $('a[href*="#"]:not([href="#"])').click(function() {
      if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
        var target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
        if (target.length) {
        if ($(".x_mark_img").is(":visible")) {
            $(".x_mark_img").click();
        }
          $('html, body').animate({
            scrollTop: target.offset().top-80
          }, 1000);
          return false;
        }
      }
    });
  });

【讨论】：

如果你在桌面模式下点击“服务”，菜单就会消失
哦，我没有检查桌面。让我再看看。
@Fabio，是的，你是对的，点击时菜单消失
请立即查看答案
@NanditaAroraSharma，抱歉回复晚了。给我一些时间用我的代码实现你的代码。