bootstrap tooltip stay open after click
Bootstrap Tooltip Stay Open After Click
To make a Bootstrap tooltip stay open after click, you can use the data-trigger
attribute and set it to 'manual'
. Then, you can use JavaScript to control the tooltip behavior. Here's an example of how you can achieve this:
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-trigger="manual" title="Tooltip on click">Click me</button>
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
$('[data-toggle="tooltip"]').click(function(e){
e.stopPropagation();
$(this).tooltip('show');
$(document).click(function(){
$(this).tooltip('hide');
});
});
});
</script>
In this example, the data-trigger="manual"
attribute ensures that the tooltip is triggered manually. Then, the JavaScript code binds a click event to the element with the tooltip, preventing the tooltip from closing when clicked and closing it when the document is clicked