Turn the Tooltip Bootstrap functionality off

Question

According the documentation is is possible to turn off the functionality just doing $('body').off('.alert.data-api').
In the case of tooltip I tried the following from js console $('body').off('.tooltip.data-api') but it does not disable the tooltip on bottons.
Any hints how to precede?

Answer 1

You can't disable tooltips that way because it has no event listener on the body. Instead, you can disable the tooltips themselves using the code below.

$('[rel=tooltip]').tooltip()          // Init tooltips
$('[rel=tooltip]').tooltip('disable') // Disable tooltips
$('[rel=tooltip]').tooltip('enable')  // (Re-)enable tooltips
$('[rel=tooltip]').tooltip('destroy') // Hide and destroy tooltips

Answer 2

Can you try:

$('a[rel=tooltip]').tooltip();
$('a[rel=tooltip]').off('.tooltip');

Don't forget to change the selector. Works fine for me... http://jsfiddle.net/D9JTZ/

Answer 3

To permanently disable a tooltip:

$('[data-toggle="tooltip"]').tooltip("disable");

To stop the tooltip from being displayed on hover but have the ability to re-enable it:

$('[data-toggle="tooltip"]').tooltip("destroy");

$('[data-toggle="tooltip"]').tooltip(); // re-enabling

Answer 4

I found a way to do it using CSS! Just add .tooltip { visibility: hidden } to your CSS file.

If you want to make your link accessibility friendly without the tooltip, then just add aria-label= "Here's a link description."

Hope this helps!

Answer 5

I struggled too with this, but I came up with a solution! In my case I use Jquery Sortable which is ofcourse annoying when you have tooltips flying around!

So I made a variable

var sort = '0`;

And since almost every tooltip has an init() function, I created

if(window.sort!='1') { // So I'm not sorting
  init.tooltip();
}

So, this can be the easiest enable/disable function!