圖像在滑塊中相互淡入淡出

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 - 據我瞭解，你需要同時淡入淡出，這可能與jQuery的工作有點相似，但是，如果你只寫一個簡單的功能，可以同時淡化它們（例如，一次又一次地將不透明度拉下數百次迭代）。