JCrop in Firefox attaches original image height/width

Question

We're using the JCrop library for cropping the profile picture. When the user changes his profile picture, the new picture still uses the old image dimensions. This works in Chrome but doesn't work in Firefox. I remove the previous image and the JCrop using the destroy:

jcrop_api.destroy();

I have also added this line of code in an attempt to clear the styles that contains the width and the height.

$('#target').removeAttr('style');

I'm experiencing this same issue. Did you ever find a solution? — Will Hitchcock, Jan 13 '14 at 20:54
possible duplicate of [JCrop, how to clear all the div width/height markup?](http://stackoverflow.com/questions/12257390/jcrop-how-to-clear-all-the-div-width-height-markup) — Paul Sweatte, Jun 21 '14 at 01:23
Hi Paul, I believe this question is similar but not a duplicate because we understand how to delete a JCrop object. However, in Firefox the functionality is not working. — Anshuman Biswas, Jan 26 '15 at 17:41

score 1 · Accepted Answer · answered Nov 28 '14 at 12:28

I have also met this issue and I tried everything and finally discovered a workaround that works for me:

There must be an alert() function if using Firefox and jcrop destruction and initialization again.

// Clear selector
if (jcropAPI) {
    jcropAPI.destroy();
    }

initCropper();

// If browser is Firefox, fix bug with stretching
if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
    // Do Firefox-related activities
    alert('File successfully loaded');  // this alert is necessary
    if (jcropAPI) {
        jcropAPI.destroy();
    }
    initCropper();
}

JCrop in Firefox attaches original image height/width

1 Answers1