Jquery colorbox not resizing properly after $.html()

Question

I have this code in success hook on ajax event:

success: function (data) {
    $(loadTarget).html(data.details);
    $.colorbox.resize();
}

loadTarget is div in already opened colorbox.

Problem is that color box will sometimes not resize properly, as if $.html() was asynchronous.

According to this question Resizing colorbox after loading HTML content into a DIV Ajax callback work somehow mysteriously and that they are responsible for this, but I don't understand how that could be a reason if $.html() is in ajax callback too.

Why is that and how to fix it?

Answer 1

It turned out to be issue of images.

$.html() just inserted img tags, and $.colorbox.resize() happened before images were loaded.

Found two ways to fix

1. Using jquery Load hook
2. Setting height property to img that (if known)