Question

我有一个使用fullPage.JS的网页。有一个带有5个水平幻灯片的firstPage部分，通过data-menuanchor导航到标题菜单。此外，还有一个带有3个水平幻灯片的secondPage部分，通过页脚菜单导航，也可以通过data-menuanchor进行导航。

我希望每个li菜单项在导航到相应部分时更改颜色。现在我通过使用：focus CSS选择器完成了大部分工作。但是，这仅在单击菜单项时有效。当通过触摸滚动，按键滚动等进行导航时，我还需要改变亮点。

最初，我认为我可以通过使用＆＃34; active＆＃34;来实现这一目标。类被传递到菜单，但我很快意识到，由于我的页面结构，＆＃34;活跃＆＃34; class同时传递给菜单中的每个li ....我的标题菜单中的所有五个项目或我的页脚菜单中的所有3个项目。

在得出结论我不能使用＆＃34; active＆＃34;为了根据需要进行区分，我开始关注＆＃34; fp-viewing-firstpage-X＆＃34;当每个部分和幻灯片导航到...时，给予身体的类

然而，我对这两种方法都没有好运。

首先，我试着用CSS做这一切：

.fp-viewing-firstpage-1 .item {
color:white;
}

在没有取得成功之后，我尝试在onLoad，onLeave，afterRender回调等中使用此javascript ......：

if ( $('body').hasClass('fp-viewing-firstpage-1') ) {
    $('.item').addClass('white');
    }

到目前为止，这两种方法都没有实现我的目标，即无论是如何导航到的，都会更改相应部分导航到的任何菜单项的颜色。

非常感谢您的协助！