Comments on: Making fancy websites without Flash 2: Animating background image

By: ChristianLouboutinShoes

ChristianLouboutinShoes — Thu, 03 Jun 2010 11:34:13 +0000

Very good sharing this.

By: janimal

janimal — Fri, 07 May 2010 09:13:31 +0000

I used a modulo function to send the images sequentially and to wrap around the index, but the issue is the same as Jason has.

The problem appears to be related to your point number 5 in the post.

The script never replaces the image used for the initial div. I will try to fix it myself, but I am brand new to Javascript.

For those struggling with a sequential function try the following.
1) use the array index instead of a string to set the next image
eg: $(‘#banner’).BgImageTransition(‘/images/featured/’+bgImages[currIndex]);

2) Set currIndex to 0 before calling setInterval

3) increment currIndex within setInterval like this
currIndex = ++currIndex % bgImages.length;

This will give you sequential indexes which wraps around to the 1st element when it reaches the upper bound of the array

By: Jason

Jason — Fri, 02 Apr 2010 01:40:35 +0000

I’m also trying to run through a list of images, which was easy enough to do, however it alternates to the initial image every other time.

So instead of: Image1.jpg, Image2.jpg, Image3.jpg, Image4.jpg, Image5.jpg…..
I’m getting: Image1.jpg, Image2.jpg, Image1.jpg, Image4.jpg, Image1.jpg, Image6.jpg…..

By: Bill

Bill — Fri, 11 Dec 2009 14:44:06 +0000

This is very helpful. However, in your demo, Rosso Castilla.JPG never loads?

By: georgi

georgi — Fri, 28 Aug 2009 06:53:54 +0000

You should I am no sure whether you can. Just create a new div element the first child of the body and make it “snap” the body borders. Then make it switch images.

By: Karthick

Karthick — Thu, 27 Aug 2009 22:32:32 +0000

Hi Georgi,

Great script! but i have to apply it on body tag instead of div..Could u plz guide?

Thanks,

karthick

By: georgi

georgi — Fri, 31 Jul 2009 10:03:59 +0000

@Tom: I cannot write your js since you know your project much better and your job to do it. Create an array with the images and loop through it instead of using random()

By: Tom

Tom — Fri, 31 Jul 2009 07:50:21 +0000

Thanks Georgi.

I don’t suppose you know the JS that should be used instead of Math.random()

I’m afraid my JS knowledge is very limited..

Thanks,

Tom