tooltipster wiggles/shakes when opened on ajax content

[sderrick]

I have static tootips that open with the specified 'grow' animation, but the tips that get there content through an ajax call wiggle/shake on the first load. then they open normally.

all the tips have animation set -- animation: 'grow',

The content is loaded successfully and looks fine.

Is there a way to stop the wiggle?

here is the init code

$('a.personRef').each(function () { $(this).tooltipster({ theme: 'tooltipster-light', contentAsHTML: true, maxWidth: 500, trigger: 'custom', side: 'bottom', animation: 'grow', interactive: true, contentCloning: true, content: 'Loading...', triggerOpen: { click: true, touchstart: true }, triggerClose: { click: true, scroll: true, tap: true }, functionBefore: function (instance, helper) { var $origin = $(helper.origin); // we set a variable so the data is only loaded once via Ajax, not every time the tooltip opens if ($origin.data('loaded') !== true) { $. get ($origin.attr('href'), function (data) { // Append the parsed HTML of the retrieved page to a dummy

var elements = $("

").append($.parseHTML(data)).find('div.personBlock'); instance.content(elements); var tip = instance.content(); $(tip).find('div.personPage img').imagesLoaded().done(function (instance) { $origin.tooltipster('reposition'); initSecondaryFlex($(tip).find('div.personPage div.refImage')); }); $(tip).find('div.personPageReduced img').on('load', function (event) { if ($(tip).find('div.personPageReduced img') && ($(tip).find('div.personPageReduced .flexslider').length < 1)) { var cwidth = event.target.clientWidth; var cheight = event.target.clientHeight; if(cwidth > 250) { var ratio = 250/cwidth; var rHeight = ratio * cheight; $(tip).find('div.personPageReduced div.refImage').css("height", 20+rHeight+'px'); $(tip).find('div.personPageReduced div.refImage').css("width", '250px'); } else { $(tip).find('div.personPageReduced div.refImage').css("height", cheight+'px'); $(tip).find('div.personPageReduced div.refImage').css("width", cwidth+'px'); } $(tip).find('div.personPageReduced div.refImage').css('margin-bottom', '2em'); } initSecondaryFlex($(tip).find('div.personPageReduced div.refImage')); $origin.tooltipster('reposition'); }); // to remember that the data has been loaded $origin.data('loaded', true); }); } } }); });

[sderrick]

I set the animationDuration:0; And annoying wiggle went away, but now the cool animation:grow; doesn't work. Is there a better way?

[louisameline]

Hello, does the updateAnimation option work for you? It should work if you set it to null I think.

[sderrick]

animation:'grow', updateAnimation:null,

Gets me half there! I now don't get the shakes(which I now know is 'rotate') on a tip that loads via an ajax call, but I don't get any animation on the first click, rotate or grow. After that closing and opening I get the requested animation. thanks, Scott

[notonlybutalso]

animation : 'fade', updateAnimation: 'fade',

There we go, all sorted!