eh

<html>
<link rel="stylesheet" type="text/css" href="mycss.css">
<title>What's My Name?</title>
<script>
function myFunction(){
alert("This is an image of a "+document.myForm1.Lion.value+""+document.myForm2.Tiger.value+""+document.myForm3.Bear.value);
document.myForm.submit();
}
</script>

<body>
<br>
<center><font class="title">What's My Name?</font></center>


<table cellpadding="10" width="100" border="0" style="float:left;">
<form name="myForm1">
<tr><td VALIGN="Top" Align="center"><img src="lion.png" width=200px height=200px class="image"></td></tr>
<tr><td VALIGN="Top" Align="center"><input type="text" name="Lion" onChange="myFunction()"></td></tr>
<tr><td VALIGN="Top" Align="center"><input type="button" value="Click Me" onclick="myFunction()"></td></tr>
</form>
</table>


<table cellpadding="10" width="100" border="0" style="float:left;">
<form name="myForm2">
<tr><td VALIGN="Top" Align="center"><img src="tiger.png" width=200px height=200px class="image"></td></tr>
<tr><td VALIGN="Top" Align="center"><input type="text" name="Tiger" onChange="myFunction()"></td></tr>
<tr><td VALIGN="Top" Align="center"><input type="button" value="Click Me" onclick="myFunction()"></td></tr>
</form>
</table>


<table cellpadding="10" width="100" border="0" style="float:left;">
<form name="myForm3">
<tr><td VALIGN="Top" Align="center"><img src="bear.png" width=200px height=200px class="image"></td></tr>
<tr><td VALIGN="Top" Align="center"><input type="text" name="Bear" onChange="myFunction()"></td></tr>
<tr><td VALIGN="Top" Align="center"><input type="button" value="Click Me" onclick="myFunction()"></td></tr>
</form>
</table>


<br>
<br>
<hr>
<p valign="bottom" align="center">
<center><font class="description">Type the name of the image in the textbox below the image. <br> Then click the button.</font></center>
</p>
<hr>

</body>
</html>