[Overview] [Basics] [More] [Fun] [Class 2] [If] [Functions] [Timing] [Queries] [References] [Examples] [Libraries] [Assignments]
This is a more advanced illustration of how you use links and
onMouseOver to change images. In this case, each time
you move over the fish, it should change to a different image. When
you move off, it changes back to a default fish.
All of the images are taken from the Sherman's Lagoon icon gallery at
http://www.slagoon.com/gallery/macicons.html.
<script language="javascript1.1">
// Variable:
// fishimg
// Description:
// The most recent image we used for our "fishie"
var fishimg = "bob1.gif";
// Function:
// selectFish()
// Parameters:
// (none)
// Description:
// Computes the next image to use for our "fishie"
// Note:
// Uses variable fishimg to keep track of which one we used last.
function selectFish()
{
if (fishimg == "bob1.gif") {
fishimg = "fillmor1.gif";
}
else if (fishimg == "fillmor1.gif") {
fishimg = "fish2.gif";
}
else if (fishimg == "fish2.gif") {
fishimg = "hawthor1.gif";
}
else if (fishimg == "hawthor1.gif") {
fishimg = "megan1.gif";
}
else if (fishimg == "megan1.gif") {
fishimg = "quigley1.gif";
}
else if (fishimg == "quigley1.gif") {
fishimg = "sherman1.gif";
}
else {
fishimg = "bob1.gif";
}
document.fishie.src = "Images/" + fishimg;
} // selectFish()
// Function:
// updateFish()
// Parameters:
// (none)
// Description:
// Updates the fish image and schedules another update in one second
function updateFish()
{
selectFish();
setTimeout("updateFish()", 1000);
} // updateFish()
setTimeout("updateFish()", 2000);
</script>
<img name="fishie" src="Images/fish1.gif"></a>
[Overview] [Basics] [More] [Fun] [Class 2] [If] [Functions] [Timing] [Queries] [References] [Examples] [Libraries] [Assignments]
Source text written by Samuel A. Rebelsky.
This page may be found at http://www.math.grin.edu/~rebelsky/Tutorials/JavaScript/Spring1999/Examples/anifish.html
Source text last modified Wed Apr 14 12:27:23 1999.
This page generated on Wed Apr 14 12:33:31 1999 by SiteWeaver. Validate this page's HTML.