0

首先，你好。很长一段时间以来，我一直在努力实现一些目标。我正在尝试使用 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 的值自动更改，并在可能的情况下为其添加一些动画？

4

1 回答 1

2 
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 秒（1000 毫秒）后改变背景图像。
如果您想为事物设置动画，那么您应该像这样使用 $.animate() 或 $.show() 和 $.hide().somethign；

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);
于 2012-09-03T11:23:36.313 回答