jquery - スライダーで画像が互いにフェードインする

Question

私はjQueryスライダーに取り組んでいます。現在、画像がフェードアウトし、スライダーの次の画像がフェードインします。しかし、必要なのは、画像が互いにフェードインすることです。そのため、移行中はページの背景が表示されません。

ここに私のjQueryコードがあります:

$('.slider .slide:first').addClass('active').fadeIn(900);

function rotate(index) {
     $('.slider .slide.active').removeClass('active').fadeOut(900, function() {
         $('.slider .slide:eq(' + index + ')').addClass('active').fadeIn(900);
     });   
}

$('.slider-nav li').click(function() {
    clearInterval(timer);
    $(this).siblings('.active').removeClass('active');
    $(this).addClass('active');
    var index = $(this).index('li');
    rotate(index);
    timer=setInterval(go, 5000);
    return false;
});
$('.slider-nav li:first').click();
var timer=setInterval(go, 5000);
function go() {
    var $next = $('.slider-nav li.active').next();
    if ($next.length == 0){
        $next = $('.slider-nav li:first');
    }
    $next.click();
}

何か案が？ありがとうございました！

Answer 1

あなた自身のfadeInが必要です - 私が理解している限りでは、両方を同時にfadeInする必要があります。それらを同時にフェードインします（つまり、数百回の反復で次々と不透明度を引き下げます）。