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

Answer 1

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 2

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 3

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 4

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!

Answer 5

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

---

Edit: For Bootstrap 4, the 'destroy' command has been replaced by the 'dispose' command, so:

$('[rel=tooltip]').tooltip('dispose') // Hide and destroy tooltips in Bootstrap 4