I am using qTip (jquery.qtip-1.0.0-rc3.min) and jQuery (jquery-1.3.2).
When using qTip in IE with non-dynamically loaded content qTip works fine. However, when loading content via an ajax call the qTip content does not resize once content is loaded. I have tried adding an updateWidth on the various callbacks without any luck. In fact, when utilizing updateWidth I get a small white box at the top left corner of the qTip content. This same code works fine in Safari, Firefox, and Opera.
What's going on with IE that is keeping the content from resizing when using an ajax call?
$(document).ready(function() {
$('ul.person_info li:first-child').each(function() {
$(this).qtip({
show: 'mouseover',
hide: 'mouseout',
style: {
name: 'cream'
},
content: {
url: '<%= Url.Action("FindPerson", "People") %>',
data: { id: $(this).attr('id') },
method: 'get'
}
});
});
$('ul.person_info li:first-child').qtip({
api: {
onContentUpdate: function() { this.updateWidth(); },
onContentLoad: function() { this.updateWidth(); },
beforeContentLoad: function() { this.updateWidth(); }
}
});
});