Question

I’m at a loss. I’m using JQuery 1.4.2 and JCrop 0.98. Everything else works fine, but I cannot move a selection once created. When I mouse over the selection and click, nothing happens.

I have the JQuery library, the JCrop library and the JCrop css file all included. It’s a pretty clean page without much else on it. I don’t know if I’m accidentally overriding something in my own javascript and css in such a way that it breaks JCrop, there’s quite a bit of both. But Firebugs isn’t turning anything up.

The tutorials work fine with my browse and on my server, though they do use a different version of jquery. However, when I replace the version they originally used with the version I use they continue to work just fine. So it has to be something to do with my javascript or css.

I’m at a completely loss here, I’m looking at everything I can think of for where an issue might be, but I don’t even know where to look. Has anyone else ever run into this issue before? What was the problem and how did you solve it? Where should I look for an error or bad override?

Answer 1

Problem solved:

* { margin: 0; padding: 0; position: relative; }

The position: relative; was overriding JCrop’s need for absolute positioning. Once removed, it worked beautifully. I’d needed it for other stuff, but I just applied it on a more precise basis.

Took me forever to find it though, had to take both my javascript and css into one of their demo files and check each piece for conflict. Pain in the butt.

If you experience a similar problem, check to see if you have a similar conflict of positioning.