How To Crop Image

Question

What is the best way to crop the image just after selecting the image through  FileUploader  ? Hint: I want to do like following

Afzaal Ahmad Zeeshan · Answer

There are many online tutorials already available. For example have a look at this tutorial http://code.runnable.com/UgMlyUpcxK0hAABy/how-to-create-image-cropping-using-jquery-ui. This would allow you to get an overview of how-to create a new plugin if you want to create a new plugin from scratch.

Afzaal Ahmad Zeeshan · Answer

Great close the thread by marking my post as solution. :-)

Praveen · Answer

Thanks @ Afzaal

Praveen · Answer

Thank you Afzaal ! You right I have taken this snapshot from Facebook. I think It's no matter what type of control we're using you know after rendering everything is fine(HTML). I want to create some custom JavaScript functions which could do the same functionality which is being used by  Facebook  or any others so if you have any idea kindly share your experience.

Afzaal Ahmad Zeeshan · Answer

For these functions and others of similar types JavaScript is used not the server-side controls. Because JavaScript is what is used to communicate with the user once the website has rendered. So the feature that you are showing here (of Facebook perhaps) also uses JavaScript to allow users to select an area of image and then crop the image. JavaScript is a very popular language and many developers have already built many such libraries for you you can get one of those from this search result. Or you can give this plugin at jQuery a look.