Toggling Graphics in DHTML

The code for this page is as shown below.
<HEAD>

<TITLE>Toggling Graphics</TITLE>

<SCRIPT LANGUAGE="JavaScript">

function toggleImage (source)
{
	if (document.images)
	{
		document.images[0].src = source;
	}	
}

function toggleText (name)
{
	document.select.hubble.value = name;
}

</SCRIPT>

</HEAD>

<BODY>

<A HREF="../dhtmlidx.html">Dynamic HTML Index</A><BR><BR>

<CENTER>
	<TABLE CELLSPACING="5" CELLPADDING="0" BORDER="0">
		<TR><TD>
			<A HREF="#" 
				onMouseOut="toggleImage('../graphics/CartWheelGalaxy.jpg');toggleText('Cartwheel Galaxy');"
				onMouseOver="toggleImage('../graphics/CygnusLoop.jpg');toggleText('Cygnus Loop');"
				onClick="toggleImage('../graphics/LagoonNebula.jpg');toggleText('Lagoon Nebula');"
			>
				<IMG SRC="../graphics/CartWheelGalaxy.jpg" BORDER="0" ALIGN="left"> 
			</A>
		</TD></TR>
		<TR><TD ALIGN="center">
			<FORM NAME="select" ACTION="" METHOD="get">
				<INPUT TYPE="text" NAME="hubble" value="Cartwheel Galaxy">
			</FORM>
		</TD></TR>
	</TABLE>
</CENTER>