Reputation: 45
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