Image resizing client-side with javascript before upload to the server

Question

I would like to know if it is technically possible to resize an image at a client-side with javascript (really resize, not just change width and height). I know it's possible to do it in flash but I would like to avoid it if possible. Is there any open source algorithm somewhere on the web?

Answer 1

You would need to perform the resize at the server side, unfortunately.

If it were possible through JavaScript (which I don't think it is), you would almost certainly have cross-compatibility issues.

Answer 2

I haven't seen that javascript can resize images

I googled a little and found this topic http://stackoverflow.com/questions/973591/resizing-images-on-client-side

Hmm... read more on the thread, and it seems to be flash solution.

Answer 3

Perhaps with the canvas tag (though it's not portable). There's a blog about how to rotate an image with canvas here, I suppose if you can rotate it, you can resize it. Maybe it can be a starting point.

See there also.

Answer 4

Hi there. It is possible to do using the HTML5 canvas tag. As others have mentioned, this only works on standards compliant browsers.

There may be some other way to resize an image using IE, but that wouldn't be open source.

If you're interested in the canvas solution, let me know, and I'll show you.

Answer 5

It it will be possible with html5.

For now, you can use Silverlight to do it. Here is a great starting point.

http://www.codeplex.com/SilverlightFileUpld

Answer 6

This is promising:

http://www.resize-before-upload.com/

Answer 7

http://www.plupload.com

HTML5: Image resizing is only possible on Firefox 3.5+ and only at a fixed quality. WebKit/Opera doesn't support direct data access to the selected files.

The rest it handles with Flash.