Question

I want to add a JavaScript functionality to an array of thumbnails such that the image would expand upon clicking instead of opening in the current window. I am thinking of having a function within the onclick attribute, but I don’t think this work:

<script type='text/javascript'>
 function expand(){
  this.height = 200;
  this.width = 200;
 }
</script>

<a href='/image_1.jpg' onclick='expand()'>
 <img src='/image_1.jpg'>
</a>

If JavaScript is not enabled, I would like the link to work. Any idea how to go about doing this? Thanks for your time 🙂

Answer 1

You have to give this as a variable in the function for example ths

<script type='text/javascript'>
 function expand(ths){
    $(ths).find('img').height('200');
    $(ths).find('img').width('200');
  return false;
 }
</script>

<a href='/image_1.jpg' onclick='expand(this)'>
 <img src='/image_1.jpg'>
</a>

And return false says Prusse.

** UPDATED **
If you want to resize image, you must call the image and no link.