jQuery Image Crop Plugin: Jcrop
10
Sep
For the last weeks, several JavaScript image crop resources are published at WebResourcesDepot. This is because, the increase in use of such interfaces as image-based applications are on the rise & many web applications offer their users to edit their avatars besides only uploading them. So, you may need one of them : ) .
Jcrop is a cross-browser jQuery image crop plugin.
Some features of Jcrop:
- Attaches simply to any image in your HTML page
- Supports aspect ratio locking
- Callbacks for selection done, or while moving
- Keyboard support for nudging selection
- Support for CSS styling
- Advanced API including animation support
P.S. Thanks to Kelly for the suggestion.
- Tags:
Javascript Php
- Filed under: Browsing, Goodies, MIT License
- 33 Comments
33 Responses for "jQuery Image Crop Plugin: Jcrop"
[...] jQuery Image Crop Plugin: Jcrop [...]
Yeah this one is good, already seen one jQuery code with similar feature, but plugin is little better.
using jcrop for asp.net component. Visit to:
http://bloq.cenq.net/aspnet-image-croper-component.html
Hi
This is very cool and rich of functionality, can we integrate this with Java.
Please suggest.
@rocks: no, it will not integrate with java as java unless java has some sort of markup/JS rendering engine that can be embedded.
In a JAVA environment, you would just build your own controls. It’s silly to even think JS could be used in a JAVA application.
@rocks: I believe it can be integrated with JSPs, if that’s what you’re asking. Just handle the image manipulation on the Java side once you get the coordinates from jCrop.
This article is using jcrop for asp.net (component).
http://www.omerfarukzorlu.com/post/ASPNET-Image-Croper-Component-with-JCrop.aspx
Hey just wanted to say thank you for the plugin. I replaced an older prototype plugin with this and it is working great!
Am trying to implement this inside an iFrame and it works just fine, wiht the following exception:
There is a really ugly and thick black border around the iFrame. I tried adjusting the size of the iFrame, but the black border around the iFrame prevails. The styling for the iFrame conatins no margins, borders, or padding? Does anyone know how to fix this?
Thanks,
SId
@bham
What do you mean by It’s silly to even think JS could be used in a JAVA application?
just looking into how to implement this into codeigniter
To use it with java you can try build your app with GWT and call Jcrop function as a native method
I am just going to give this script a try in my current CodeIgniter project. I hope I will love it as much as JQuery. Any information regarding CodeIginter integration is appreciated!
Great scripts, it’s help me..
Hey!! The link appears to be broken
@Sinki,
Just updated the link.
Hey Link still appears to be broken man, just wondering if you could upload the documentation somewhere. Otherwise looks great!
@Vince,
The original page if down but the download can be found in the Google Code page (download includes various demos, sadly, that seems to be the only documentation).
Do anyone know is it possible to open html page with already opened crop?
you can fetch the coordinates of selection and pass it in query string to a serverside script. which in turn renders a div with the main image as background-image and those passed coordinates as background-position
The link isn’t broken -> the protocol has a typo.
Website: hhttp://code.google.com/p/jcrop/
Notice the extra h in http.. typos suck! hehe
@Michael Pope,
Just fixed it. Thanks.
Hi, can everyone add double click action to crop the image?
I can’t see the Demo, can someone mention the demo link?
@amir,
Here it is: http://deepliquid.com/projects/Jcrop/demos.php
Hi,
I took the liberty of making a PHP library and putting up an enhanced example page which lets the user upload a file, then crop it with preview.
Here’s the library: http://hotfile.com/dl/131371190/45e8718/crop.rar.html
Forgot to mention: The library supports both direct and file outputting.
- The “direct” just shows it to the browser,
- The “file” allows for the cropped image to be saved. The options to the crop are seen in the cropLibrary.php file.
It’s set to be generic, so it will work with other adapters as well, as long as the provided parameters are provided.
Also, thanks to the author for a great jQuery plugin. Have been looking for one for a while.
- bakkelun
jcrob is the best plugin in jquery world =)
Anyone know of a JQuery cropper that slides the image around beneth a set box size (frame) like when you crop with facebook.
Fantastic plugin, finished up a requirement in a single evening with it.
Thx
Hey man,
Great post! Thanks for the info
This is an awesome plugin – just what I was looking for.
Bob.
Haines:
I was looking for a similar cropper for my site, but can’t seem to find one. This one is still pretty good, but not quite what I need!
Do me a favour and comment if you do find one! Cheers!
bakkelun: your modified version is no longer available…