View Full Version : jCrop vs. IE8 : selection dragging/resizing

11-14-2010, 03:55 AM

I'm using jCrop in a photo upload/crop script. You can view a demo page here (http://www.custom-anything.com/sand/jcropie8.php).

My client reports that when she uses the script in Internet Explorer 8, she has problems dragging and resizing the crop area: the cursor changes to a "stop" (crossed-out circle) image, and the selection area won't move.

I've been unable to recreate this problem for testing (I've tried in IE 8 as well as 6 & 7, and it always works fine). My client has made a video to describe the problem, which you can view here (http://cid-90fcee9a986480fc.skydrive.live.com/redir.aspx?page=self&resid=90FCEE9A986480FC!106&type=3&Bpub=SDX.Docs&Bsrc=Docmail&parid=90FCEE9A986480FC%21105&authkey=fUguCKF3X54%24).

new link to video; no login required

If anyone has any suggestions, I'd be most appreciative.


11-14-2010, 09:23 AM
I don't choose to have an id to login to the video. However I find that if I try to drag the crop outside the image and release the left mouse button out there, IE 8 doesn't fully register the mouseup event. After that things get screwy. The circle with a line through it cursor can happen if I then go back and try to drag the crop. Other things get odd if I was resizing when I dragged the mouse outside the image. Doing a full click anywhere 'fixes' things until I drag outside the image again. But I had to guess in order to discover all that.

I think this is a bug in the script as I get the same result on their demo page:


So my suggestion would be to debug the script or find another without this problem.

In any case the problem should probably be reported to the script's author.

I have done so (reported it).

11-14-2010, 05:52 PM
thanks John,

I'm waiting to see what the authors say as well.

I've looked at the "known issues with IE" section on the jCrop page, and it doesn't quite describe what's going on here. For example, she's not dragging outside the image when (or before) this happens.

(Also, I'm surprised that you were asked to login. I don't have an account and I viewed it just fine. Try this link (http://cid-90fcee9a986480fc.skydrive.live.com/redir.aspx?page=self&resid=90FCEE9A986480FC!106&type=3&Bpub=SDX.Docs&Bsrc=Docmail&parid=90FCEE9A986480FC%21105&authkey=fUguCKF3X54%24) and you shouldn't have to log in.)

Javascript isn't my area of expertise. If you have any further suggestions about how to go about debugging, I'd really appreciate it.

11-14-2010, 06:00 PM
I've added this to the page:

<meta http-equiv=“X-UA-Compatible” content=“IE=7” />

11-15-2010, 03:54 AM
That might help with the client's issue. It doesn't help with the one I experienced. I was able to download and view the video without creating an account. It's a different issue, one I didn't experience. It's almost as if something is disabled or enabled on her mousepad there. Like a touch equals a click, something like that. It's looks as though she's clicking and dragging in one motion, and to add a left button to that is redundant. Her complaint about selecting making the selection disappear is wrong but understandable given the other difficulties she is having with that pad. At that point she has already selected, to click again starts a new selection, but since she doesn't also drag at that point, no selection is made.

I on the other hand use a real three button Logitech mouse. It's very accurate, if a bit bare bones. I hate those pads on the keyboard, too sensitive and I hit them by accident while typing, too many esoteric features. I always turn them off first thing after I power up a new laptop.

Everything works fine for me in IE unless I drag the mouse cursor outside the image as I've already noted.

About logging in for the video. If you're already registered for any of the many MS online services, and your settings permit it - login is automatic. I'm not on any of those, so I would have had to of created an account.

About a debug, since this is a beta and the author is still soliciting bug reports, I'd be inclined to let him have his best shot.

I can tell you that the version you have isn't even the most recent, like 0.98b vs 0.99b. And the script relies upon browser sniffing. It should rely upon feature detection. But that's only half the battle. It's what's done about a lack of a certain feature that's crucial. I'd be inclined here to - when the mouse is down, not let it out of the boundaries of the image. But that only helps with my problem, not the client's. I'll have to think about what might help that. But I'm suspicious that it might simply be her mousepad settings.

There are other scripts out there that do this sort of thing. Look for one that is out of beta. As a rule of thumb though you should never offer a client work based on a beta. There are enough problems with full release versions.

11-15-2010, 04:31 AM
Thanks John,

Actually, triggering compatibility mode did solve the client's issue (well - it's a functional workaround, anyway). I guess this might be a mousepad issue, but she says it works perfectly in Firefox. As for offering this script over others - we had discussed several options for cropping, and this is the one she decided upon. It actually works very well, aside from these IE issues.

about the video - I think the link my client sent me (the second one I offered) circumvents the login requirement somehow. It redirects to the video page, whereas when I type the URL in directly, I'm asked to log in as well (for the first link I offered, I just copied the direct URL). I've never signed up for anything MSonline, either.

thanks very much for your help!