单击时关闭移动幻灯片菜单

我正在使用创建，这是一个由Themetrust提供的WP主题，在他们的论坛上没有得到回复。我正在使用平滑滚动的幻灯片菜单，链接/滚动工作正常。目前，幻灯片菜单仅在单击“x”图标时关闭。单击菜单链接时，会正确进行平滑滚动，但菜单保持可见。我希望菜单以与单击“x”时相同的方式滑开。

在下面的代码中，我尝试将“#滑动面板”切换为“菜单切换关闭”。这似乎适用于已调整大小的移动浏览器，但在实际的移动设备上不起作用。如有任何建议，将不胜感激。

以下是HTML：

<div id="slide-panel">
    <div class="hidden-scroll">
        <div class="inner has-mobile-menu">

            <nav id="slide-mobile-menu" class="menu-one-page-menu-container"><ul id="menu-one-page-menu" class="collapse sidebar"><li id="menu-item-1274" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1274"><a href="#our-approach" data-ps2id-api="true">Our Approach</a></li>

功能如下：

function initSlideMenu(){
var siteContainer = $j(\'#site-wrap\');
slideMenu = $j(\'#slide-panel\');
slideMenuWidth = slideMenu.outerWidth();
$j(\'.menu-toggle.open\').on(\'click\', function () {
    slideMenu.css(\'transform\', \'translateX(0)\');        
});
$j(\'#menu-toggle-close\').on(\'click\', function () {      
    slideMenu.css(\'transform\', \'translateX(\' + slideMenuWidth + \'px)\');     
});
var browserWidth = $j(window).width();
if(isMobile.any() && browserWidth < 768) {
    var browserWidth = $j(window).width();
    slideMenuWidth = browserWidth;
    slideMenu.css(\'width\', browserWidth + \'px\');
}
slideMenu.css(\'transform\', \'translateX(\' + slideMenuWidth + \'px)\'); 
slideMenu.css(\'visibility\', \'visible\');

}

<script> (function($){ $(window).on("load",function(){ $("body").on("click","#slide-mobile-menu .menu-item a[href*=\'#\']",function(){$("#menu-toggle-close")[0].click();}); }); })(jQuery); </script>

Disable Top Nav Bar on Mobile

我创建了一个网站（www.smartgrowtheconomics.com），使用2017年的主题加上一些额外的CSS，在桌面和平板电脑上看起来不错，但在智能手机上始终显示蓝色下拉菜单和搜索栏。我试过一些CSS，包括.导航顶部{显示：无；}和.主导航{可见性：隐藏；}但无法删除栏、菜单和搜索栏。我不知道JS，但我以前用说明粘贴过代码片段。谢谢

相关推荐

Disable Top Nav Bar on Mobile