Resize bigger images with javascritpts

I found nice way to re size bigger images to fit in page using java scripts as resizing images with php is resource hungry and bandwidth eating process. Can't process each image from external servers!
We all know html code for image.

<img src="http://i49.tinypic.com/28tglyr_th.jpg">

Now here added one function on onload event of image tag.

<img id="random_uniq_id" src="http://i49.tinypic.com/28tglyr_th.jpg" onload="resize(this.width,this.height,this.id);">

So what's inside this function?


<script>

function (real_width,real_height,uniq_id)
{
var d = document.getElementById(uniq_id);
var new_width, new_height;
if(real_width >= 600) { new_width = real_width/3; new_height = real_height/3;
d.width = new_width;
d.height = new_height;
}
if(real_height >= 500) { new_width = real_width/3; new_height = real_height/3;
d.width = new_width;
d.height = new_height;
}
}
</script>


This is simple way to re size images from client side! It's easy.

PS: always call functions in head section.

1 comments:

Anonymous said...

hello

Post a Comment