スライダーにfadeInなどのエフェクトをヘッダに追加する

Question

基本的には、写真がすでに変更されている場合にのみfadeInを追加します。

$(document).ready(function() { 
    var num = 1; 
    setInterval(function() { 
    num += num + 1; 

    if(num > 4) num=1; 

    $('#nav').css('backgroundImage', 'url(photo'+num+'.png)'); 
    },4000); 
}); 

Answer 1

次のコードを使用して、fadeInとfadeOutの効果を与えます。 これは4秒間隔で画像を変更します。 fadeInとfadeOutの時間変更間隔を長くする。

$(document).ready(function(){ 
     var num = 1; 
     setInterval(function(){ 
      ++num; 
      $("#demo").fadeOut(1500, function() { 
       if(num == 4) 
        num = 1; 
       $('#demo').css("background-image","url('photo"+num+".png')"); 
      }).fadeIn(1500); 
     }, 4000); 
});