Here's an anchor tag with a tooltip:
<a data-toggle="tooltip" data-original-title="Apologies, pronunciation audio is currently unavailable.">
<span class="glyphicon glyphicon-volume-off pronounce">
</span>
</a>
When viewing on desktop screens, the tooltip will only appear when the anchor is hovered over or clicked and will disappear when the mouse pointer moves away. However, when viewing on mobile screens, the tooltip will stay visible even after tapping the anchor. Is there a way to make the tooltip fade out after a certain amount of time specifically on mobile devices?
UPDATE: Just for reference, my tooltip JavaScript code looks like this:
$(document).ready(function() {
$("body").tooltip({ selector: '[data-toggle=tooltip]' });
});