January 29th, 2003

Slayer!!

I'm smart!

So tonight, the three imaginary girls ask me to write some code that will allow them to have a series of images rotate at random on the home page. The idea was that they usually have one picture in a spot that goes along with the main article, but this time the main article was about five bands, so they wanted the image to change every 45 seconds to a random image of one of the bands.

At first, I didn't really see how I could do it. I figured at very least, I could make it so that every time you loaded the page, it could choose one of them at random, but it didn't occur to me that I could have it change out automatically on an interval.

But, I thought it over in the grocery store and decided I could probably come up with something. Then I came home and wrote this:



<p><img src="b0.gif" alt="zero" name="randomImage" width="13" height="16"></p>

<SCRIPT LANGUAGE = "Javascript">
var rgImages = new Array();
var currentImage = new Image();
startTheCommotion();

function startTheCommotion()
{
// Populate the array with all the possible images.
rgImages[0] = new imageItem("b0.gif", "The number zero");
rgImages[1] = new imageItem("b1.gif", "The number one");
rgImages[2] = new imageItem("b2.gif", "The number two");
rgImages[3] = new imageItem("b3.gif", "The number three");
rgImages[4] = new imageItem("b4.gif", "The number four");
rgImages[5] = new imageItem("b5.gif", "The number five");

// Stick a random image in there now
rotate();

// Stick a new random image in there on the interval
setInterval('rotate()', 5000);
}

function getRandomImage()
{
var ran_number=parseInt(Math.round(Math.random()*(rgImages.length - 1)));
currentImage.src = rgImages[ran_number].url;
currentImage.alt = rgImages[ran_number].alt;
}

// This function is just so I can have a multidimensional array.
function imageItem(url, alt)
{
this.url = url;
this.alt = alt;
}

function rotate()
{
getRandomImage();
document.images['randomImage'].src = currentImage.src;
document.images['randomImage'].alt = currentImage.alt;
}

</script>


The result is that the page loads with a default image, which changes right away, and then every five seconds changes to one of the others (randomly chosen). You can see it in action here.

It seems pretty insignificant, but I'm kinda proud of this little bit of code, because it's a neat little function and it's something I never thought of doing before. And I liked standing up to the challenge.

Yes. I'm a nerd.
  • Current Music
    Betty Wright - If You Love Me
Slayer!!

In other news...

1. I'm thinking about getting a tattoo in Vegas. Current picks are either some flaming dice on the inside of my right forearm, or a monkey (with a fez) on a scooter on my upper left arm.

2. LiveJournal is slow as fuck-a-doodle-doo lately.

3. I swam 14 laps today. 16 would have been a half mile, but we ran out of time. I beat Sherwin in a one lap (50 meter) race by about one Steve-length.