jcrop is not working properly with IE

Question

I have used crop in my .net web application. All the browsers are pretty much fine with the code. However, IE shows weird behaviour. I have tried other posts but they are either not helpful or kind of a hack. here is the javascript code:

jQuery(function ($) {
                api = $('<%= "#" + target.ClientID %>').Jcrop({
                    onChange: showCoords,
                    onSelect: showCoords,
                    onRelease: clearCoords,
                    aspectRatio: 1
                }, function () {
                    api = this;
                    api.setSelect([10, 10, 110, 110]);
                    api.setOptions({ bgFade: true });
                    api.ui.selection.addClass('jcrop-selection');
                });

            });

on first try IE fails to load the dotted lines but sometimes on second try it works. Seems kind of timing issue or image loading problem...Thanks

Answer 1

Actually I found the problem, so I will first mention what is wrong with IE, then will describe my solution. As I stated in the question is a timing issue. IE loads the script before getting the picture from server.

To resolve that you have to wait until the picture is downloaded:

$('<%= "#" + target.ClientID %>').load(function () {
    api = $('<%= "#" + target.ClientID %>').Jcrop({...

and the target is obviously my asp:Image control.