I'm trying to set up a picture gallery (with my own code so I can get some practice with html, javascript, DOM, etc.). When a thumbnail is clicked on, the main picture is supposed to change. The problem is that I can't get the picture to change permanently when I click on a thumbnail. Whenever I click, the right image comes up but is immediately replaced back with the original image. I'm not sure if this is even a js problem; it could be something in the html code.1. How can I get this to work properly?2. Also, is there an easier/better way to do this?Thanks.
<head><script type="text/javascript">function setPic(url) { document.images["picture"].src = url;}</script></head><body bgcolor="#fffccc"><table><tr><!--THUMBNAILS--><td valign="top"><table cellpadding="1" border="1" bgcolor="#000000"><tr><td><form><input type="image" src="logarska_dolina/CD_2_(8).jpg" height="50" width="50" onclick="setPic(this.src)"></input></form></td></tr><tr><td><form><input type="image" src="logarska_dolina/CD_2_(9).jpg" height="50" width="50" onclick="setPic(this.src)"></input></form></td></tr></table></td><!--PICTURE--><td> <table cellpadding="10" border="1" bgcolor="#000000"> <tr><td align="center" name="img_cell"> <img src="logarska_dolina/CD_2_(8).jpg" name="picture"></img> </td></tr> </table></td></tr></table></body></html>