DarknessGlow
DarknessGlow

Reputation: 45

Changing Background Images with jQuery

Trying to get a simple background image swap code to work, but its getting hung up on the first 'interval' if you will. How do I make it progress?

$(window).load(function() {
var i =0;
var images = ['img2.jpg','img3.jpg','img4.jpg', 'img1.jpg']
var image = $('#backgroundchange');
            //Initial Background image setup
image.css('background', 'url(img1.jpg) -110px no-repeat');
image.css('background-size', 'cover');
            //Change image at regular intervals
setInterval(function(){   
 image.fadeOut(1000, function () {
  if (i==0)
     image.css('background', 'url(' +images[i]+ ')no-repeat -330px');
     image.css('background-size', 'cover');
  if (i==1)
     image.css('background', 'url(' +images[i]+ ')no-repeat');
     image.css('background-size', 'cover');
  if (i==2)
     image.css('background', 'url(' +images[i]+ ')no-repeat');
     image.css('background-size', 'cover');
  if (i==3)
     image.css('background', 'url(' +images[i]+ ')no-repeat');
     image.css('background-size', 'cover');
 image.fadeIn(1000);
 });
 if(i == images.length)
  i = 0;
}, 7000);            
});

Upvotes: 0

Views: 30

Answers (1)

obe
obe

Reputation: 7788

You don't change the value of i anywhere in this code...

Upvotes: 1

Related Questions