Flipping/switching images with HTML/javascript?

  • Thread starter Thread starter sparkle
  • Start date Start date
S

sparkle

Guest
Alright, this is hard to explain, so here is an example:

http://vanessa-anne.org

Can you see how the main top banner changes from one image to another? I was wondering what the code what for that. It looks amazing, and I'd like to have a switching banner like that on my site (:
 
I don't know JS very well, but it should work like this:

// Generate a random number, times it by 4, and round it to the nearest whole number
var imgnumber = Math.floor(Math.random()*4);
// Print the number at the end of an image source
document.write('<img src="http://www.yoursite.com/yourimage' + imgnumber'.png">');

This requires that you have 4 images, named yourimage0.png, yourimage1.png, yourimage2.png, and yourimage4.png, and that you have them at http://yoursite.com. (Obviously you want to change this to fit your needs) It should then switch randomly between them on each refresh, but I haven't tried it myself.
 
Back
Top