FullPage JS onLeave

Question

我使用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>

Answer 1

根据您的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)");
}