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 t

Answer 1

Some compilation from other SO questions.

Example Show tooltip on hint click, and hide tooltip on elsevere click

$(document).on('click', '.hint', function(){ //init new tooltip on click
   $(this).tooltip({
      position: { my: 'left+15 center', at: 'center right' },
      show: false,
      hide: false
   }).tooltip('open'); // show new tooltip
}).on('click', function(event){ // click everywhere
   if(!$(event.target).hasClass('hint'))
     $(".hint").each(function(){
        var $element = $(this);
        if($element.data('ui-tooltip')) { // remove tooltip only from initialized elements
           $element.tooltip('destroy');
        }
     })
});

$('.hint').on('mouseout focusout', function(event) { // prevent auto hide tooltip 
    event.stopImmediatePropagation();
});