jQuery Jcrop setSelect shows visually, but when clicked to move, it jumps

I am using the jQuery plugin Jcrop. I have an issue with one of the initial setup settings called setSelect.

The property takes in an array with two sets of x and y coordinates (top left corner, an开发者_如何学编程d bottom right corner).

<img src="blah" id="cropTool" />
<script type="text/javascript">
    $(function()
    {
        $('#cropTool').Jcrop(
        {
            setSelect: [
                $('#cropTool').width()/4,
                $('#cropTool').height()/4,
                ($('#cropTool').width()/4)*3,
                ($('#cropTool').height()/4)*3
            ]
        });
    });
</script>

Visually this does exactly what I expect. It places a crop selection with the top left corner 1/4th of the way into the image (x and y) and the bottom right corner 1/4th of the way into the image from the bottom right of the image. Like this:

http://www.codetunnel.com/content/images/VisuallyFine.jpg

But then when I go to move it, it jumps to this position:

http://www.codetunnel.com/content/images/Jumps.jpg

It jumps there immediately, I'm not dragging it there. If I try to drag the default selection it jumps after moving it by one pixel or more. After it jumps I can move it around normally. It's a somewhat minor issue, but it is annoying.

Any ideas?

Turns out another jQuery plugin I was using was interfering with the jcrop positioning. A plugin called colorbox which loads overlay popups was the issue. I was calling jQuery.colorbox.resize() right before I was calling jcrop. When the jcrop code ran the resize was never quite complete. One solution was to put the jcrop code into a setTimeout() to delay the code for a second. That was hackish solution so I asked another more specific question and got an answer. Turns out another fork of colorbox contains a fix to include a function callback on the resize method so that you can execute code when the resize is complete.

jQuery colorbox plugin resize callback

Not sure if this is quite it and you just did a copy/paste from your source but there's a typo here:

$('#ropTool').height()/4,

You're probably looking for $('#cropTool').height()/4,