自动滚动页面+关闭侧边栏后菜单项选择+链接菜单项与部分ID（Wordpress - Jquery）

Question

我正在尝试创建自定义侧边栏菜单...我有一个带有部分的页面站点...每个侧边栏菜单链接都应连接到特定部分。我已创建菜单但有两个问题：

1) 我想在 jquery 的帮助下将菜单项与部分 ID 链接起来。 2) 当用户点击侧边栏中的菜单项时，它应该会自动关闭并将页面滚动到该部分。

我是 Jquery 和 wordpress 的新手。请帮我解决这个问题。

侧边栏 HTML：

<ul id="primary-menu" class="main-nav" role="menu">
    <li class="menu-item menu-item-type-custom menu-item-object-custom">
        <a href="#quote" data-level="1">
            <span class="menu-item-text">
                <span class="menu-text">Instant Quote</span>
                <i class="underline"></i>
            </span>
        </a>
    </li> 
    <li class="menu-item menu-item-type-custom menu-item-object-custom">
        <a href="#ethos" data-level="1">
            <span class="menu-item-text">
                <span class="menu-text">Ethos</span>
                <i class="underline"></i>
            </span>
        </a>
    </li>             
</ul>

这是我的侧边栏：

Answer 1

您必须为您的部分提供特定的 ID，例如 <section id="quote">

然后在你的 main.js 中写一些东西

$('.menu-item').find('a').click(function(){
        var $href = $(this).attr('href');
        var $anchor = $($href).offset();
        $('body, html').animate({ scrollTop: $anchor.top} ,1500);
        return false;
    });

关闭侧边栏这取决于你是如何制作这个侧边栏的。