[thelist] Random image on page load

Michael Barrett mbarrett at triad.rr.com
Fri Aug 17 15:12:19 CDT 2001


Here's a javascript I found to handle just such an occaision. I employed it
on http://www.curve-film.com

This goes in the <head> of your html doc.
Replace the image paths and names with your images.


<SCRIPT LANGUAGE="JavaScript">
<!-- Original:  Nicholas Lupien (smylex at aol.com) -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
var rand1 = 0;
var useRand = 0;

images = new Array;
images[1] = new Image();
images[1].src = "images/image1.jpg";
images[2] = new Image();
images[2].src = "images/image2.jpg";
images[3] = new Image();
images[3].src = "images/image3.jpg";
images[4] = new Image();
images[4].src = "images/image4.jpg";
images[5] = new Image();
images[5].src = "images/image5.jpg";
images[6] = new Image();
images[6].src = "images/image6.jpg";

function swapPic() {
var imgnum = images.length - 1;
do {
var randnum = Math.random();
rand1 = Math.round((imgnum - 1) * randnum) + 1;
} while (rand1 == useRand);
useRand = rand1;
document.randimg.src = images[useRand].src;
}
//  End -->
</script>

"image/imagex.jpg" is the path to your random images, where "x" is the
number of the image. Of course you can name your images anything you want,
just be sure to edit the script so that the paths are accurate.



Place this in your HTML doc where you want the random image to appear. Be
sure to put in the correct image height and width for your first image, and
that all images that follow are the same size.

<a href="#" onClick="swapPic();"><img name="randimg" src="images/image1.jpg"
width="197" height="417" border="0" alt=""></a>


-- Michael Barrett
-O^O-
 - 

mbarrett at triad.rr.com
AIM: device55





More information about the thelist mailing list