I have 3 tooltips. I want them to appear in the click, so I used the following:
$('[data-toggle="tooltip"]').tooltip({
trigger : 'click'
});
So, when I click on the first one, for example, it displays the tooltip.
However, I want when I click on a tooltip it activates the same one and deactivates others that are active.
Does anyone know how to help me?
Follow another solution , showing the tooltips manually
Whenever the click event of an element that has a tooltip fires, it hides all visible tooltips and shows only the tooltip of the clicked element.
Here's a fiddle with a working example: link
You should close all other tooltips and open just what you clicked.
With this html:
<a class="btn" rel='popover' data-placement='bottom' data-original-title='Teste 1' data-toggle='tooltip'>Um</a>
<a class="btn" rel='popover' data-placement='right' data-original-title='Teste 2' data-toggle='tooltip'>Dois</a>
It would only take this call to behave as it quoted:
$('[data-toggle="tooltip"]').tooltip({trigger: 'click'});
$('[data-toggle="tooltip"]').on('click', function (e) {
$('[data-toggle="tooltip"]').not(this).tooltip('hide');
});
Follow sample link: link