javascript - 使fadeIn和fadeOut效果在jquery中顺利工作

Question

我有一个页面，我的图像将淡入并有淡出效果。淡入选项似乎是一些问题，因为它立即发生...请找到我的 jsfiddle。

请帮忙

Answer 1

两件事，首先fadeIn()仅在隐藏元素上运行，因此您需要最初隐藏图像，其次您需要等待fadeOut()动画完成，然后再为下一张图像设置动画。这段代码应该对你有用，我删除了间隔和计数变量：

var $slideshowImgs = $('.slideshow img').hide();
(function fadeSlideshow ($img){
    var $next = $img.next();
    if(!$next.length)
        $next = $slideshowImgs.first();
    $img.delay(2000).fadeOut(function(){
        $next.fadeIn();
        fadeSlideshow($next);
    });
})($slideshowImgs.first().show());

演示小提琴

Answer 2

检查这个 js fiddle http://jsfiddle.net/TXrDk/2/

利用

transition:.5s ease-in-out;