scaling an image proportionally without knowing dimensions - php

Question

I have a script the retrieves remote images from various URLs. The width and height are unknown variables.
I have them displaying on my page and I'm reducing the height to 55px for each. However, the images that are very wide (banners, etc.) are displaying at their full width.
I can't constrain the width and height because I'll distort the image. Does anyone know a creative solution that will proportionally scale these images so they don't exceed 55px(h) AND 75px(w)?
p.s. I've tried getimagessize() in php, but the functions takes way too long to complete
Thanks!

Answer 1

I had a similar problem but I was using jQuery. But I think you can use the same logic in php to calculate the image size.
var maxWidth = 75; // Max width for the image
var maxHeight = 77; // Max height for the image
var ratio = 0; // Used for aspect ratio
var width = $(this).width(); // Current image width
var height = $(this).height(); // Current image height
// Check if the current width is larger than the max
if(width > maxWidth){
ratio = maxWidth / width; // get ratio for scaling image
$(this).css("width", maxWidth); // Set new width
$(this).css("height", height * ratio); // Scale height based on ratio
height = height * ratio; // Reset height to match scaled image
width = width * ratio; // Reset width to match scaled image
}
// Check if current height is larger than max
if(height > maxHeight){
ratio = maxHeight / height; // get ratio for scaling image
$(this).css("height", maxHeight); // Set new height
$(this).css("width", width * ratio); // Scale width based on ratio
width = width * ratio; // Reset width to match scaled image
}
Hope this is of any help.
Bah I just realized I brain farted, unknown image size. Disregard the whole thing

Answer 2

and hey you could always use css to do that! like this answer explains, but you'll have avoid supporting ie6 and maybe ie7 for this feature (you could use conditional comments for resizing with javascript or serverside php script in this scenario)
by the way the above answer does work! but you should add the img programtically and the get the image height and width straight from the object like this and then run the resize function above:
var rimg = new Image();
rimg.src = "yourimageserverurl";
var original_height = rimg.height;
var original_width = rimg.width;
start the resize function on rimg..