我正在使用图像滑块,并且想在每个图像上的文本中添加这个fadeIn函数,但是它仅在我的第一个图像上起作用,其余的都可以进行淡入,因此当下一张幻灯片出现时,该文本已经可见

ul class="bxslider">
        <li>
            <img src="img/sister-religions.png" alt="">
            <figcaption class="slide-info" >
                <h1>TITLE </h1>
                <p>prompta, mea id quem odio. Quo an officiis vivendum consequat, usu ad stet offendit repudiare. Sonet option euismod in sea. Ad vis brute posidonium, in qui enim utamur recusabo.</p>
            </figcaption>
        </li>
        <li>
            <img src="img/test1.png" alt="">
            <figcaption class="slide-info" >
                <h1>TITLE </h1>
                <p>prompta, mea id quem odio. Quo an officiis vivendum consequat, usu ad stet offendit repudiare. Sonet option euismod in sea. Ad vis brute posidonium, in qui enim utamur recusabo.</p>
            </figcaption>
        </li>
        <li>
            <img src="img/test2.png" alt="">
            <figcaption class="slide-info" >
                <h1>TITLE </h1>
                <p>prompta, mea id quem odio. Quo an officiis vivendum consequat, usu ad stet offendit repudiare. Sonet option euismod in sea. Ad vis brute posidonium, in qui enim utamur recusabo.</p>
            </figcaption>
        </li>
</ul>


这是jQuery代码

(function($){

$(document).ready(function(){

    $('.bxslider').bxSlider({
         onSliderLoad: function(){

        $('.slide-info').fadeIn(3000);

      },
        onSlideAfter: function(){

        $('slide-info').fadeIn(3000);
      }
    });

 });


})(jQuery);

我只需要将它应用于当前的图像说明,而不是全部,

最佳答案

onSlideAfter接受参数


  函数参数是当前的幻灯片元素(转换完成时)。


所以尝试

onSlideAfter: function(slide) {
    slide.find('.slide-info').fadeIn(3000);
}


我还要删除onSliderLoad处理程序。

10-05 20:39
查看更多