褪色图像 – 在哪里调用.fadeIn和.fadeOut？

我和这个人打了一会儿。 我是JavaScript和jQuery的新手。 经过大量的反复试验后，我最终设法编写了一个函数来更改图像的src属性，从而创建幻灯片：

$(function () { var slideshow = $("#img_slideshow"); var images = [ 'img/slideshow1.jpg', 'img/slideshow2.jpg', 'img/slideshow3.jpg']; var current = 0; function nextSlide() { slideshow.attr( 'src', images[current = ++current % images.length]); setTimeout(nextSlide, 5000); } setTimeout(nextSlide, 5000); }); 

这非常有效，每5秒钟更换一次图像。 我想要的是他们之间的渐变过渡。 我尝试在几个地方调用.fadeIn和.fadeOut我找到逻辑，例如在setTimeout旁边（可能是错误的），但什么都行不通。 有人可以帮忙吗？ 我很感激有一个简单的解释，它应该被称为什么，可以帮助很多人。 谢谢。

Answer 1

它应该这样做（使用回调） –

 function nextSlide() { slideshow.fadeOut(function() { $(this).attr('src',images[current = ++current % images.length]).fadeIn(); }); setTimeout(nextSlide, 5000); } 

这可以确保在淡出完成之前不会更改源。 然后发生源变化和淡入淡出。 但这并不是一个交叉淡入淡出。