用动画自动更改img src值jquery

Question

首先，你好。我一直试图在很长一段时间内取得成就。我试图创建一个使用jQuery的背景全屏幻灯片。我确实使用css动画实现了这一点，但如果您选择一个新选项卡，然后返回到带有css动画的选项卡，它就会像地狱一样落后。我认为这不会发生如果使用jQuery。此外，我试图尽可能简单地创建它，而不使用已经构建的jquery幻灯片插件，但我不能。

---

现在我明白了。对于我的网站的背景我通常使用

<div id="background"> 
    <img src="background.jpg" class="stretch" alt="" /> 
</div> 

与下面的CSS：

#background { 
    width: 100%; 
    height: 100%; 
    position: fixed; 
    left: 0px; 
    top: 0px; 
    z-index: 0; 
} 

.stretch { 
    width:100%; 
    height:100%; 
} 

所以，是有可能使IMG SRC的值自动改变，如果可能增加一些动画呢？

Answer 1

var urlArray = [ 
'url1','url2','url3' 
]; 
var slideShowTimings = 1000; 
var i=0 
setInterval(function(){ 
var $img = $($('.stretch')[0]); 
$img.attr('.src',urlArray[++i%urlArray.length]); 
},slideShowTimings); 

试试这个。这应该每隔1秒（1000ms）后更改背景图像。
如果你想动画的东西，那么你应该使用$ .animate（）OR $ .show（）和$ .hide（）。somethign like this;

var urlArray = [ 
'url1','url2','url3' 
]; 
var slideShowTimings = 2000; 
var i=0 
setInterval(function(){ 
var $img = $($('.stretch')[0]); 
$img.hide(slow,function(){ 
$img.attr('.src',urlArray[++i%urlArray.length]); 
$img.show(fast) 
}); 
},slideShowTimings);