how to resize image onclick?

[demiurgen]

i have a image gallery. where the thumbnails are set like this:

<div class="thumbnail">
  <a href="#"><img src="img/img0001.pg" width="200" border="0" /></a>
</div>
<div class="thumbnail">
  <a href="#"><img src="img/img0002.pg" width="200" border="0" /></a>
</div>
<div class="thumbnail">
  <a href="#"><img src="img/img0003.pg" width="200" border="0" /></a>
</div>
etc.......

i am not sure what is the best sollution...
i want to click an image and instead of loading a new page or window i want just the width of both the thumbnail class and the img tag to change to 600.

can this be done with javascript??

[gil davis]

<div class="thumbnail">
  <a href="#" onclick="return false"><img src="img/img0001.pg" width="200" border="0" onclick="this.width=600;this.parentElement.parentElement.style.width=600"/></a>
</div>

[demiurgen]

check it out here:
http://www.morganwaage.com/gallery/gallery.php

it doesn't look like it is changing the div, just the img...
or there may be something wrong with my html...

is there a just as easy way of resizing them back to 200 again??

[gil davis]

it doesn't look like it is changing the div, just the img

<script type="text/javascript">
function toggle(it) {
  if (it.width == 200)
    {it.width = 600;}
  else
    {it.width = 200;}
}
</script>
...
<div class="thumbnail">
  <img src="img/img0001.pg" width="200" border="0" onclick="toggle(this)">
</div>

It works for me. You'll have to show me what the CSS is for "thumbnail".