<HTML>
<HEAD>
<TITLE>JavaScript Demo Example 4 Alternate</TITLE>
<script language="javascript" type="text/javascript">
<!-- Hide script from older browsers
if(document.images) {
// define and load images for faster display.
bluestar = new Image();
bluestar.src = "starblue.gif";
goldstar = new Image();
goldstar.src = "stargold.gif";
greenstar = new Image();
greenstar.src = "stargren.gif";
purplestar = new Image();
purplestar.src = "starpurp.gif";
silverstar = new Image();
silverstar.src = "starslvr.gif";
yellowstar = new Image();
yellowstar.src = "staryell.gif"; }
function display_image(image_name,new_image_file) {
if(document.images) {
document[image_name].src = new_image_file; } }
//-->
</script>
</HEAD>
<BODY BGCOLOR="WHITE">
<table width="100%">
<tr>
<td width="50%">
<h3 align="center">Swap one image for another<br>
by passing the mouse pointer<br>
over the text below.</h3>
</td>
<td width="50%">
<h3 align="center">Swap one image for another<br>
by passing the mouse pointer<br>
over the image. <a href="example_4alt_html.htm">View source.</a></h3>
</td>
</tr>
<tr>
<td>
<p align="center"><a href="#"
onMouseOver = "display_image('star1','stargold.gif')"
onMouseOut = "display_image('star1','starblue.gif')"
onClick = "return false;">Change this blue star to a gold star.</a>
<img src="starblue.gif"
name = "star1"
alt = "This blue star will change to a gold star."
border="0"></p>
<p align="center"><a href="#"
onMouseOver = "display_image('star2','starpurp.gif')"
onMouseOut = "display_image('star2','stargren.gif')"
onClick = "return false;">Change this green star to a purple
star.</a>
<img src="stargren.gif"
name = "star2"
alt = "This green star will change to a purple star."
border="0"></p>
<p align="center"><a href="#"
onMouseOver = "display_image('star3','staryell.gif')"
onMouseOut = "display_image('star3','starslvr.gif')"
onClick = "return false;">Change this silver star to a yellow
star.</a>
<img src="starslvr.gif"
name = "star3"
alt = "This silver star will change to a yellow star."
border="0"></p>
</td>
<td>
<p align="center"> <a href="#"
onMouseOver = "display_image('star4','stargold.gif')"
onMouseOut = "display_image('star4','starblue.gif')"
onClick = "return false;"><img src="starblue.gif"
name = "star4"
alt = "This blue star will change to a gold star."
border="0"></a></p>
<p align="center"> <a href="#"
onMouseOver = "display_image('star5','starpurp.gif')"
onMouseOut = "display_image('star5','stargren.gif')"
onClick = "return false;"><img src="stargren.gif"
name = "star5"
alt = "This green star will change to a purple star."
border="0"></a></p>
<p align="center"> <a href="#"
onMouseOver = "display_image('star6','staryell.gif')"
onMouseOut = "display_image('star6','starslvr.gif')"
onClick = "return false;"><img src="starslvr.gif"
name = "star6"
alt = "This silver star will change to a yellow star."
border="0"></a></p>
</td>
</tr>
</table>
<p> </p>
<p><a href="fun_with_javascript.htm#Example4">Return to
Having Fun with JavaScript</a>.</p>
</BODY>
</HTML>