使fadeIn和fadeOut效果在jquery中顺利运行

Question

我有一个页面，我的图像会淡入，淡出效果就在那里.. fadein选项似乎是一些问题，因为它发生immediatley ...请找到我的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());

<强> Demo fiddle

Answer 2

检查这个js小提琴 http://jsfiddle.net/TXrDk/2/

使用

transition:.5s ease-in-out;