淡入淡出效果看起来太明亮俗气，

Question

嗨，大家好我修改了一些代码，我发现它会在一次悬停时生成图像褪色，但会导致幻灯片之间的白色激烈闪光，看起来非常俗气。我用这张图片设置了黑色背景，但它似乎没有什么区别。

什么是实现幻灯片之间平滑过渡的方法？

此外，这是我工作过的最复杂的代码，我如何才能在没有被悬停事件触发的情况下每3秒切换一次照片？

setTimeout(function(){ 
    $('.photo-holder').hover(
     function() { 
      $(this).stop().fadeOut("100", function() { 
       $(this).css("background",  "url('http://tbc/images/ropes.jpg')").fadeIn(100); 
      }); 
     }, 
     function() { 
      $(this).stop().fadeOut("1000", function() { 
       $(this).css("background", "url('http://tbc/images/weights.jpg')").fadeIn(1000); 
       700 
      }); 
     } 
    ); 
    700 
}); 

Answer 1

会是这样的沿着正确的线？

// You may want to preload these images 
var photos = ['ropes.jpg', 'weights.jpg']; 
var currentPhoto = 0; 

function changePhoto() { 
    $('.photo-holder').fadeOut(function() { 
     $(this).css('background-image', 
        "url('http://tbc/images/" + photos[currentPhoto] + "')"); 
     currentPhoto = (currentPhoto + 1) % photos.length; 
    }).fadeIn(); 
} 

setInterval(changePhoto, 3000);