我正在使用图像滑块,并且想在每个图像上的文本中添加这个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
处理程序。