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

Question

我正在尝试创建一个自定义侧边栏菜单...我有一个页面网站上有部分...每个侧边栏菜单链接应该连接到特定部分。我创建了菜单但有两个问题：< / p>

1）我想在jquery的帮助下将菜单项与section 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;
    });

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