search

tapmodo / Jcrop

Jcrop - The Javascript Image Cropping Engine
https://jcrop.com
Other
4.31k stars 939 forks source link

Box sizing doesn't work properly with ajax-uploaded images? #104

Open Brade opened 11 years ago

Brade commented 11 years ago

This one's got me tearing my hair out. I've made an app that allows people either to select a Facebook album photo OR upload their own, after which the image uses Jcrop to allow resizing. Both can potentially be large images, so I'm using the Box sizing parameters from here: http://deepliquid.com/content/Jcrop_Sizing_Issues.html

For some reason, the Facebook photos always resize correctly, whereas the uploaded files do not. When I inspect the code, I see that the inline styles that Jcrop adds are incorrect for the uploaded photo--it sets the width/height to be the size of the scaled area instead of the width/height of the actual image file. My Jcrop initializing code is exactly the same for both methods, and the image tag that is inserted by both methods via AJAX is exactly the same too. So I have NO clue what's going on, but however Jcrop determines the width/height of the original image is clearly not working right for the uploaded version.

ghost commented 10 years ago

I have the same issue with ajax-uploaded files. Images with a bigger width than 500px are getting set with a width of 500px so the cropping isn't done correctly and the image is stretched.

ghost commented 10 years ago

Hello, I could track down my problem. My problem was I set a max width for a parent div, so the image couldn't be bigger than that. Just posting a possible cause if someone has the same issue.

spointecker commented 8 years ago

I had the same problem as you @CharlotteDunois. I tried to crop the image within a bootstrap modal window, which caused the same behaviour due to the fixed modal width. my solution was to set the width of the modal window to "auto" (= full size modal window)