The script in the header, which gets executed before the document is loaded, pre-loads the two images.

The function "show(N)" changes the source of the image. The images in the document form an array, images[i]. The function show() changes the src property of the image, which loads the image from cache.

<SCRIPT>
coaster= new Image()
coaster.src="gifs/coaster.gif"

blank= new Image()
blank.src="gifs/GreenBlank.gif"

function show(N){
document.images[0].src=N.src
}
</SCRIPT>

The onClick handlers call the "show()" function.

<INPUT TYPE=button NAME="button1" VALUE="show coaster" onClick=show(coaster)>