添加圖像更改效果jquery javascript

Question

我有以下加載三個不同的圖像間隔2.5秒。

<script type="text/javascript"> 
    var imgsld = ['@Model.imageUrl[0]', '@Model.imageUrl[1]', '@Model.imageUrl[2]'] 
    var step = 0 
    function slideit() { 
    if (step < 3) { 
     document.getElementById("slideimg").src = imgsld[step]; 
     step++; 
    } 
    else 
     step = 0; 
    } 
    setInterval("slideit()", 2500) 
</script> 

我把它放在我的ASP.net MVC視圖中。

如何在圖像更改時添加過渡效果？

謝謝。

Answer 1

function slideit() { 
if (step < 3) { 
    $('#slideimg').fadeOut('slow',function(){ 
    $(this).attr('src',imgsld[step]).fadeIn('slow'); 
}); 

    step++; 
} 
else 
    step = 0; 
}