Hi guys!

Im working on a new feature in my site and I got stucked really bad. Im using JCrop obviously to crop an Image on my website.

The new feature that I've been asked to Implement is to allow the user to change the colors of the Image being cropped.

I have now 3 images , Color, GrayScale and Sepia.

I can change the source of the image tag using javascript so the image gets changed without reload but I cannot do this once the JCrop has been enabled because it replaces the original Image for a new one.

I thought I could disable JCrop, Replace the Image and then Re-Enable, but i couldnt do such thing.

The example I found where the JCrop gets destroyed (example5 in Demo zip) uses an object :

jcrop_api = $.Jcrop('#cropbox');

But Im enabling JCrop in a different manner,more like Example 3 :

            jQuery('#cropbox').Jcrop({
                onChange: showPreview,
                onSelect: showPreview,
                aspectRatio: 1
            });

How can I destroy JCrop so I can replace te Image? Is there another way to do this?

Please help!

I Could easily reload the page each time the user changes de color of the image but we all know that's not cool.

Any comments will be apreciated.

Thanks