This is a very basic "mouseover" using two images. When the cursor passes over the primary black and white image DHTML scripting tells your browser to replace it with the second, color image. Here is the scripting.
Inside the <head> tags comes the function commands, which are inside <script>
tags:
<script language="Javascript1.1">
function ImgChange(imgNum,imgSrc) {
document.images[imgNum].src = imgSrc;
}
</script>
Next comes the coding in the main body of the document:
<a href="javascript:nothingMuch();" onMouseOver="ImgChange('moreTaylor', 'taylor3.gif');"
onMouseOut="ImgChange('moreTaylor', 'taylor.gif');">
<IMG name="moreTaylor" WIDTH=146 HEIGHT=181 src="taylor.gif" "146" "181"
border=0> </a>
The function code (called "ImgChange") defines the parameters of the event at the
beginning of the document. It has two variables, the first named "imgNum" tells the browser
which image to alter and the second one, named "imgSrc", tells the browser where that image
is to be displayed. The function tells the browser to change the source from "imgNum" to "imgSrc"
whenever an event requires it to do so (in this case the MouseOver and MouseOut events).
The event code itself, with the "MouseOver" and "MouseOut" commands, applies these parameters
to these two images, taylor.gif and taylor3.gif.