Auto hide bootstrap tooltip

I use this for page-wide auto-hide on all bootstrap tooltips:

$(function () {
   $(document).on('shown.bs.tooltip', function (e) {
      setTimeout(function () {
        $(e.target).tooltip('hide');
      }, 10000);
   });
});

Bootstrap has this out of the box, you can set a delay property in options (in js)

delay: { show: 500, hide: 100 }

and in HTML:

data-delay='{"show":"500", "hide":"100"}'

where hide will get triggered after 100 ms


try this

$('#element').on('shown.bs.tooltip', function () {
   setTimeout(function () {
    $('#element').tooltip('destroy');
   }, 2000);
})