Javascript: resize image to fit window, then switch full size and adjust size on click?

I am trying to create a small snippet to adjust the uploaded image according to the user's resolution. And then let the user switch between the actual image size and the specified image size for their resolution. This is what I got so far:

<img src="<?=$file['direct_url']?>" border="0" onload="if(this.width>screen.width/1.5) {this.width=screen.width/1.5;this.alt='Click image to view full size';}window.status=this.width;" onmouseover="if(this.alt) this.style.cursor='hand';" onclick="if (this.width=screen.width/1.5) {this.width=screen.width*1.5} else {this.width=screen.width/1.5}">

      

Any help is greatly appreciated!

0


a source to share


1 answer


I think the only thing you might need is a custom attribute where you store the original image with / height.

<img originalwidth="100" originalheight="100" />

      



You can get / use these values ​​using:

this.getAttribute('originalwidth');
this.getAttribute('originalheight');

      

0


a source







All Articles