Jcrop Tech Notes

Jcrop » FAQ

Contents


Technical notes on Jcrop are here.

It's pretty easy to get going with Jcrop but before you seriously use it in an application you should probably read over the following information to understand more about how Jcrop works and to avoid potential pitfalls that might create problems.

Caveats

Attach Jcrop from jQuery(window).load()
No doubt this will be the most common "gotcha" for those not reading the documentation or examples closely. Due to the nature of Jcrop working on an image, it should only be invoked after the entire page has loaded. This means you should use jQuery(window).load() to invoke instead of jQuery(document).ready() or shortcuts to that effect. You may (and probably should) still use jQuery(document).ready() for other jQuery or Javascript code that doesn't bear this restriction.
Attach to an unstyled image
No testing has been done on attaching to a styled image, and doing so will probably create unexpected behavior. To be specific, styles such as borders or opacity applied to an image which is then converted may lead to bizarre behavior when converted by Jcrop. This could probably be normalized with more code, but for the time being it's best to ensure the image you're converting is not styled.

Known Issues

It can be difficult to drag to an edge of the image
This has been mostly mitigated by expanding the border where the mouse is tracked. Now, the image has an adjustable-width border around it that you can also click/drag in/to/etc. I'm not sure this is the ultimate solution, but dragging to the edge of the image is greatly improved now.
Odd selection behavior dragging out of bounds in IE6
If you are dragging and you mouse-off the image, a section of the cropper and a section of the page will become selected. I can guess why this is happening, but I'm not sure of a fix for it. I did try some various applications of the IE-proprietary "unselectable" attribute, but to no avail. Actually, having those in there was creating some performance issues too, for whatever reason. If there are any IE gurus that would like to submit suggestions or patches, I'm all ears!
Dragging a handle causes intermittent performance issues in IE6
In my tests, sometimes dragging a handle in IE6 causes odd performance issues, then you can drag the same handle again and it will be fine. Oh Bill, you keep clowning me...

Internet Explorer

Some workarounds had to be applied to achieve functionality in IE6+. Mostly these were CSS changes, (unfortunately added into the CSS with the infamous *-rule approach for now). Thankfully, the few mods to the Javascript code do not incur any additional logic in the primary loops. It was great elation when it finally worked in IE6+, and I'm pleased to report that it even LOOKS the same there, too. Wow.

Retrieved from "http://www.deepliquid.com/content/Jcrop_Tech_Notes.html"