使用fullPage.js將活動類添加到兩個/拆分菜單

Question

我正在使用fullPage.JS，並且讓菜單部分工作正常（上下滾動），除了我希望菜單的一半放在頁眉中，一半放在頁腳中。 這對於導航工作正常，但是不會將“活動”類僅添加到頁眉中的頁腳中的li。 我假設它是因為兩個菜單都具有與刪除標題菜單ID相同的ID，從而使頁腳菜單可與活動類一起使用。 我如何同時工作？ 回調也許？

類似於此答案： FullPage.js-在不匹配的部分上將活動類添加到菜單錨點

$('#fullpage').fullpage({
    anchors: ['PAGE1','PAGE2','PAGE3','PAGE4','PAGE5','PAGE6',],
    menu:'#menu',
});

<div id="headermenu">
    <ul id="menu">
        <li data-menuanchor="PAGE1"><a href="#PAGE1">PAGE1</a></li>
        <li data-menuanchor="PAGE2"><a href="#PAGE2">PAGE2</a></li>
        <li data-menuanchor="PAGE3"><a href="#PAGE3">PAGE3</a></li>
    </ul>
</div>

<div id="footermenu">
    <ul id="menu">
        <li data-menuanchor="PAGE4"><a href="#PAGE4">PAGE4</a></li>
        <li data-menuanchor="PAGE5"><a href="#PAGE5">PAGE5</a></li>
        <li data-menuanchor="PAGE6"><a href="#PAGE6">PAGE6</a></li>
    </ul>
</div>

Answer 1

在HTML中， id屬性必須唯一。 如果要將選擇器應用於多個元素，請使用CSS類，例如：

<ul class="my-menu">
</ul>

...
<ul class="my-menu">
</ul>

然后您的選擇器將如下所示：

menu:'.my-menu'