jquery循环通过不同的背景

Question

我正在尝试更改不同的背景，以便循环显示图像数组并每隔5秒计时一次。

这是我的代码：

function changeBG(){

     //array of backgrounds
     var array = ["test.jpg", "test2.jpg", "test3.jpg",];


     for ( var i=0, len=array.length; i<len; ++i){
         $('.round-mask').css('background-image', 'url("images/work/'+array[i]+'")');

      }

}

window.setInterval(changeBG(), 5000);

这不起作用，我可以看到它正在循环，但我总是得到第3张图像。

有什么想法吗？

提前致谢。

莫罗

Answer 1

请尝试〜

    <script  type="text/javascript">
    var now = 0;
    var int = self.setInterval("changeBG()", 1000);
    var array = ["001.jpg", "002.jpg", "003.jpg", ];

    function changeBG(){
        //array of backgrounds
        now = (now+1) % array.length ;
        $('.round-mask').css('background-image', 'url("' + array[now] + '")');
    }
</script>

忘了这个〜

 for ( var i=0; i<array.length; i++){
 $('.round-mask').css('background-image', 'url("images/work/'+array[i]+'")');

  }

Answer 2

这样的事情应该有效：

var i = 0;

function changeBG(){

     //array of backgrounds
     var array = ["test.jpg", "test2.jpg", "test3.jpg",];



    $('.round-mask').css('background-image', 'url("images/work/'+array[i]+'")');

    if(i == array.length -1){
         i= 0;
    }
    else{
        i++;
    }


}

Answer 3

这确实奏效了。 2014。

var i =0 ;

//array of backgrounds
var array = [
    "1.jpg", 
    "2.jpg", 
    "3.jpg", 
    "4.jpg", 
    "5.jpg", 
    "6.jpg", 
    "7.jpg", 
    ];

function changeBG(){
    if ( i > array.length -1) {
        i = 0;
    }

    $('.slideContainer').css('background-image', 'url("img/backgrounds/'+array[i]+'")');
    i++;
}

window.setInterval("changeBG()", 5000);

Answer 4

试试这个

var i =0 ;

//array of backgrounds
var array = ["test.jpg", "test2.jpg", "test3.jpg"];

function changeBG(){
    if ( i > array.length -1) {
        i = 0;
    }

    $('.round-mask').css('background-image', 'url("images/work/'+array[i]+'")');
    i++;
}

window.setInterval(changeBG(), 5000);

Answer 5

$(element).on("click",function(){
  $("<div>").css("background-image", "url("+array[(i-1)]+")");
if (i == array.length){
 i=1;
}
else {
 i++;
}
})

这是我的编辑，实际上它正在运行 或

$(element).css("background-image", "url("+array[(i-1)]+")");
i == bb.length ? i=1 : i++;