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>

我也尝试应用fadeOut转换，以便当观看者离开它时，它会淡出，以便下次查看该部分时，转换中的淡入淡出会再次发生。但这是我非常无望的尝试：

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

afterLoad according to the documentation只有两个参数，您使用的是3：

afterLoad: function(anchorLink, index){},

onLeave according to the documentation有3个参数，您使用的是2：

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

此外，请注意您没有使用onLeave，而您使用的afterLeave不存在。

将fadeIn应用于幻灯片fullpage.js

1 个答案: