jquery ui tooltip manual open /close

Question

is there a way to manually open close the jquery ui tooltip? I just want it to react to a click event toggling on/off. You can unbind all mouse events and it will rebind them when calling .tooltip('open'), even though that should not initialize or set events imo, since if you try to run .tooltip('open') without initializing, it complains loudly about not being initialized.

Answer 1

jltwoo, can I suggest to use two different boolean switches to enable auto-open and auto-close? With this change your code will look like this:

(function( $ ) {   $.widget( "custom.tooltipX", $.ui.tooltip, {     options: {         autoShow: true,         autoHide: true     },      _create: function() {       this._super();       if(!this.options.autoShow){         this._off(this.element, "mouseover focusin");       }     },      _open: function( event, target, content ) {       this._superApply(arguments);        if(!this.options.autoHide){         this._off(target, "mouseleave focusout");       }     }   });  }( jQuery ) ); 

In this way, initializing the tooltip as:

$(someDOM).tooltipX({ autoHide:false }); 

it shows by itself when the mouse is over the element but you have to manually close it.

If you want to manually control both open and close actions, you can simply use:

$(someDOM).tooltipX({ autoShow:false, autoHide:false });