Page 1 of 1

Resizing an image on the client side

Posted: Mon Oct 29, 2007 10:33 am
by davidtube
I've seen lots of similar scripts but I've not found one that quite does what I need.

My site allows user to upload pictures. When displayed I want the images to stretch to 250px in one direction, width or height depending on which is greater, and keep the aspect ratio in the other direction (without going beyond 250px).

At the minute I have just set the HTML img element to this, but it distorts the ratio.

Code: Select all

width="250" height="250"

Posted: Mon Oct 29, 2007 10:39 am
by GeXus
You would have to resize it in PHP... but you can't have it 250px width or height, then have the other not exceed 250px while keeping the same aspect ratio... to keep the aspect ratio you can only specify width or height to be 250px max, the other will adjust accordingly.

Posted: Thu Nov 01, 2007 8:26 am
by Rovas
You can make an ajax type script that loads the resized image from the server. It' s quite easy.
Other method is to hide parts of the picture using CSS.

Posted: Thu Nov 01, 2007 9:52 am
by seppo0010
You can resize it on PHP, when you do the upload.
Ohterwise, using PHP when display, you can look if its width is bigger than its height or not and only use one attribute

Code: Select all

<?php
list($width, $height) = getimagesize($myimage);
if ($width > $height) $show = 'width';
else $show = 'height':
?>
<img src="<?php echo $myimage; ?>" <?php echo $show; ?>="250" />

Posted: Thu Nov 01, 2007 10:15 am
by davidtube
Thank you. That's a good idea. I've almost solved the problem myself but got a new problem now which I'm asking about here.

I might try your idea seppo0010 as an alternative work-around for my problem. Thanks