This happens when the crop areas dimensions are partially equal to the original image. Example:
Original image: 470px x 270px
Crop: 270px x 270px
It seems the border around the crop preview (#resizeMe) is causing this because as a result the box gets actually 272px by 272px.
This can be fixed locally by copying the included page-imagecrop.tpl.php to your theme folder and adding a little bit of CSS to it:
<style type="text/css">
#resizeMe {
border: none !important;
}
</style>
| Comment | File | Size | Author |
|---|---|---|---|
| #12 | Image Size same as Image Crop size | 140.93 KB | eriknewby |
| #12 | Not updating crop window | 140.75 KB | eriknewby |
| #3 | 561026-3.patch | 357 bytes | skiminki |
| after-moving.png | 51.83 KB | derjochenmeyer | |
| before-moving.png | 50.92 KB | derjochenmeyer |
Comments
Comment #1
derjochenmeyer commentedComment #2
rburgundy commentedexperiencing exact same issue- cannot see new cropping area live
this hasn't been commented on for about a month-
does this mean others are not experiencing this issue?
Comment #3
skiminki commentedAt least I was having this issue, too. Thanks for the fix. However, would it be better to make the CSS fix directly into imagecrop.css? Consider the patch in attachment.
Edit: Slipped a typo in patch name...
Comment #4
samchok commentedsubscribe
Comment #5
gooddesignusa commentedI have all sorts of weird issues with this module but love it so much to give it up. Heck it doesn't even work in safari
anyways thanks and i will try monday
Comment #6
eatsleepdev commentedI don't think that this is a css issue. I tried the fix and it's not working for me. I think it's javascript related. Maybe another module that I have installed is conflicting? Is the next release going to fix this? Or should I try debugging it myself? It would be awesome if this worked.
Comment #7
mrfelton commentedPlease see #697640: Crop region displayed under the image (on FF, Chrome and Safari)
Comment #8
eatsleepdev commentedThanks mrfelton. That article didn't really help me, but I did figure out what was going on.
If you're using jquery update 1.3.2, you need to manually replace the jquery ui files with version 1.7.3 that can be downloaded from jqueryui.com.
I didn't realize that this was outlined in the README.txt. Maybe it should be put on the project page.
Comment #9
nils.destoop commentedAdded extra documentation on project page + README.TXT, to notify users about jquery update + jquery ui.
Comment #11
echoz commentedI find it is true that when one crop dimension equals that dimension of the original (my case being width), dragging the crop rectangle does not update the preview. I have placed the 1.7.3 files according to the docs. I checked the js issue first, and my drag keeps #resizeMe correctly having position: absolute; and only this fixed my issue. Most people probably don't notice because their original image is likely larger than both crop dimensions. The imagecrop rectangle looks really nice without the dotted border, and it's boundaries are clear because of the opacity difference.
Comment #12
eriknewby commentedThis is actually the same issue I'm having as well. (running jui 1.7.3)
My imagecache preset has two actions applied. 1. Scale width 892. 2. image crop width 892 height 250. If you can visualize this (see first attachment), it means that in the imagecrop area I only drag up and down to choose my crop. It seems that when the image is already scaled to the width of the imagecrop, it gets confused and doesn't update. However, I've found that if I click and drag diagonally (down and to the left, or up and to the left) I can get the cropped area to update. Very strange behavior.
Comment #13
nils.destoop commentedProblem has been found, and fix has been committed.
Comment #14
nils.destoop commentedComment #15
nils.destoop commented