javascript - 将 fadeIn 应用于幻灯片 fullpage.js

Question

我在将淡入和函数应用到幻灯片的 .intro 部分时遇到问题。我已将其配置为我想要的部分，但似乎无法将其应用于幻灯片 1。我对编写 html 等非常陌生。

这是我写的css:

 #section1 .intro{
     display:none;
}

 #slide1 .intro{
     display:none;
}

这是我添加的 javascript:

afterLoad: function(anchorLink, index, slideIndex){

                //section 1
                if(index == 2){
                    //moving the image
                    $('#section1').find('.intro').first().fadeIn(800, function(){
                        $('#section1').find('.intro').last().fadeIn(800);
                    });;
                }

                //section 2
                if(slideIndex == 1){
                    //moving the image

                    $('#slide1').find('.intro').first().fadeIn(800, function(){
                        $('#slide1').find('.intro').last().fadeIn(800);
                    });;
                }

这是我要应用效果的幻灯片的 html:

<div class="section" id="section2">
    <div class="slide" id="slide1">
        <div class="intro">
            <h2>Header</h2>
        <br>
        <br>
        <br>
        <p>Text</p>
        </div>
    </div>

    <div class="slide" id="slide2">
        <img src="Images/image.svg">
    </div>
    </div>

我还尝试应用淡出过渡，以便当观众离开该部分时，它会淡出，以便下次查看该部分时再次出现淡入过渡。但这是我非常无望的尝试:

afterLeave: function(anchorLink, index){

                //section 1
                if(index == 2){
                    //moving the image
                    $('#section1').find('.intro').first().fadeOut(800, function(){
                        $('#section1').find('.intro').last().fadeOut(800);
                    });;
                }

如有任何指点，我们将不胜感激。

Answer 1

加载后 according to the documentation只有两个参数，而您使用的是 3 个:

afterLoad: function(anchorLink, index){},

休假 according to the documentation有 3 个参数，您正在使用 2 个:

 onLeave: function(index, nextIndex, direction){},

另外，请注意您没有使用 onLeave，您使用的是 afterLeave，它不存在。