CODEWITHSUNDEEP
jqueryqtip2
sivann
sivann

Reputation: 2131

remove qtip when element is removed from dom

I apply a tooltip with qtip2 via a jquery .on event on mouseover, on img and div elements. Those elements sometimes need to be removed from the DOM while the qtip is still showing, and this removal is not under my control. The result is the qtip stays there forever. How can I remove the qtip when its associated element is removed?

EDIT underlying elements are not removed with jquery's .remove() but with innerHTML=.. so qtip2 automatic removal is not working here.

Upvotes: 2

Views: 6241

Answers (2)

bhelm
bhelm

Reputation: 715

As you are asking for the QTip2 way, here it is. In your QTip2-initialization, add this:

events: {
    //this hide event will remove the qtip element from body and all assiciated events, leaving no dirt behind.
    hide: function(event, api) {
        api.destroy(true); // Destroy it immediately
    }
}

Tested with QTip 2.2.0. source

Upvotes: 3

Leniel Maccaferri
Leniel Maccaferri

Reputation: 102378

If you can update your qTip to the most recent nightly build. Then try adding this to your qTip creation:

$('#element').qtip({
   content : {stuff},
   style : {stuff},
   position: {stuff},
   show: 'mouseover',
   hide: 'click',
   onHide: function() { $(this).qtip('destroy'); }
});

You can also take a look here:

[Solved] How to destroy a qtip when the original element is removed

[Solved] clear qtips when rebuilding DOM

Upvotes: 1

Related Questions