javascript - FullPage JS onLeave

我正在使用FullPage JS建立网站。

我要更改类的CSS，然后再转到下一部分（不是afterLoad）。我正在尝试使用index函数中的参数nextIndex和onLeave进行此操作。

基本上我在找什么

onLeave: function(index, nextIndex){
    // leaving index - add color overlay
    $(".dark").css("background-color","rgba(0,0,0,.55)");

    // entering nextIndex - remove color overlay
    $(".dark").css("background-color","rgba(0,0,0,0)");
}

所有帮助表示赞赏！干杯。

HTML：

<div id="fullpage">
    <div class="section" id="section0"><div class="dark"></div><h1>fullPage.js</h1></div>
    <div class="section" id="section1"><div class="dark"></div><h1 style="color: #000;">hello</h1></div>
    <div class="section" id="section2"><div class="dark"></div><h1>Lovely images <br />for a lovely page</h1></div>
    <div class="section" id="section3"><div class="dark"></div><h1>One Image = One thousand words</h1></div>
</div>

最佳答案

根据您的HTML标记进行编辑。

index和nextIndex基于实例化FullPage的元素的子元素。

所以这应该工作：

onLeave: function(index, nextIndex){
    // leaving index - add color overlay
    $(".section").eq(index-1).find(".dark").css("background-color","rgba(0,0,0,.55)");

    // entering nextIndex - remove color overlay
    $(".section").eq(nextIndex-1).find(".dark").css("background-color","rgba(0,0,0,0)");
}