Floydian Posted August 10, 2008 Posted August 10, 2008 I'll throw 98% of the credit for this to Spudisnki and his how to in the php how to's which does the same thing. I thought it'd be worth noting that the same thing could be done with javascript. I even took his code and converted it to javascript format with minimal changes. The changes mostly involve removing $'s and getting the image size via the DOM instead of PHP's GD library. His PHP FAQ is here. Check that out for his explanation of why this is useful! <html> <head> <title>Image Resizing!</title> </head> <body> [img=bar_samp.jpg] </body> <head> <script> // use document.getElementById to get a reference to the image object in the DOM // the image we're resizing must have an id attribute. We're using id="my-image" var image = document.getElementById('my-image'); var config = []; config[0] = 150; config[1] = 150; if (image.width > config[0] || image.height > config[1]) { // if the width or hieght is greater than the specified ones var xr = config[0] / image.width; // specified width divided by the original width var yr = config[1] / image.height; // specified height divided by the original height if (xr * image.height < config[1]) { // if the height is less than the width image.height = Math.ceil(xr * image.height); // calculate the height, as it will be less than the width image.width = config[0]; // the width doesnt need any further calculation } else { // if the width is less than the height image.width = Math.ceil(yr * image.width); // calculate the width, as it will be less than the height image.height = config[1]; // the height doesnt need any further calculation } } </script> </head> </html> <!-- // Ignore the php tags lol, only used for colorization... ?>--> Quote
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.