GD Resizing

[SPYDERIX]

Hi,

I have a client that uploads photos to their website and the size they always upload is: 900 x 600

For the time being I am just calling the images and resizing in html so that the images don't break my layout. However this option is only temporary seeing as how the uploaded files are 250kb each and that whole file has to load only to show a smaller version of the image.

I was wondering how I would go about doing this easily with gd. I have looked up some gd stuff on google but most of the tutorials I found are so complex and go to the extremes right away that I just get lost.

Now there are a few different things I'm thinking of doing.
1 - resize the image from 900 x 600 down to 400 x 267 when uploading the image in the first place then output the 400 x 267 image regularly and then resize again on output down to 150 x 100 for the thumbnail
2 - upload normally like I'm doing and then just resize down to 400 x 267 for the enlarged view and again down to 150 x 100 for the thumbnail.

In either instance I will need to get 2 sizes of the same image 400 x 267 (fullsize) and 150 x 100 (thumbnail)

My question is how can I resize these images from 900 x 600 to (400 x 267) or (150 x 100) and then output them to the browser without too much pain. Right now I store all the filenames in mysql eg. (e72p5qzb4upown7.jpg) and then place in the <img> tag.

Thanks alot.

NATE

http://www.mainframe-webdesign.com

Got a question? Search G O O G L E for links to the fastest answers: www.google.com

 

[sleipnir214]

You don't specify whether your user is uploading JPEGs or PNGs. I'll assume PNGs.

Here is some simple code to resize an image:

<?php
function resize ($name, $filename, $new_w, $new_h)
{ 
	$src_img = imagecreatefrompng($name); 

	$original_w = imageSX($src_img); 
	$original_h = imageSY($src_img); 

	//The next three if-statements adjust the desired new image height and width
	//to proportionally scale the new image from the old image.
	if ($original_w > $original_h)
	{ 
		$resize_w = $new_w; 
		$resize_h = $original_h * ($new_h / $original_w); 
	} 

	if ($original_w < $original_h)
	{ 
		$resize_w = $original_w * ($new_w / $original_h); 
		$resize_h = $new_h; 
	}
	 
	if ($original_w == $original_h)
	{ 
		$resize_w = $new_w; 
		$resize_h = $new_h; 
	} 

	$dst_img = imagecreatetruecolor ($resize_w, $resize_h); 
	imagecopyresized ($dst_img, $src_img, 0, 0, 0, 0, $resize_w, $resize_h, $original_w, $original_h); 

	imagepng ($dst_img, $filename); 

	imagedestroy ($dst_img); 
	imagedestroy ($src_img); 
}

resize ('logo-495x503.png', 'logo-1000x1000.png', 1000, 1000);
?>

As far as output to the browser, it's a matter of resizing images as needed then having scripts output the appropriate <img> tags to the newly-resized images.


Want the best answers? Ask the best questions

TANSTAAFL!!

 

[SPYDERIX]

Thanks sleipnir214

NATE

http://www.mainframe-webdesign.com

Got a question? Search G O O G L E for links to the fastest answers: www.google.com