image resize while keeping ratio

Question

im listing photos using mysql. like

<?
$a = mysql_query("select * from x");
?>
<? while ($w=mysql_fetch_array($a)) { ?>
<img src="<?=$w[url]?>" alt="<?=$w[name]?>" width="150" height="110" />
<? } ?>

for this thing, how i can keep picture RATIO? a picture in width 150 and height 500 goes very very BAD quality.. how can i fix this?

Answer 1

Just specifying width-only or height-only in the HTML will keep the ratio.

Or you can actually resize your photos dynamically with a script like the Smart Image resizer: http://shiftingpixel.com/2008/03/03/smart-image-resizer/

Answer 2

If you just specify a width, all browsers (that I know of...) will scale the image correctly.

However, you might want to consider making thumbnails if you´re going to load a lot of images.

Answer 3

Just specify one dimension (either the width or the height but not both) and it will keep the ratio. With CSS you could also specify just the maximum width and maximum height:

<img src="<?=$w[url]?>" alt="<?=$w[name]?>" style="max-width:150px; max-height:110px" />

Answer 4

you can get the image size using php:

list($width, $height) = getimagesize($file);

Answer 5

Try something like this:

$ratio = $height / $width;
$new_width = 150;
$new_height = $ratio * $new_width;

Answer 6

Setting both the width and height of an forces the browser to rezise it to match what you tell it to.

Setting only one (either width or height) resizes it so that the image's ration is kept.

You can use the PHP function getImageSize to get the image's actual width and height, and then rerform a proportional resize based on height / width = new_width / new_height

Answer 7

You could use a resize script to resample (resize) the image.

A good script is located here: http://shiftingpixel.com/2008/03/03/smart-image-resizer/

To use:

<img src="/image.php?image=/img/test.jpg&amp;width=150&amp;height=500" alt="Test" />

I you plan to always use this height/width you could insert the resampled image directly in the database. This way you won't waste space on your server. If you plan to use many height/width or change these sizes in the future, you should keep the originals as you do now.