I've implemented the bootstrap tooltips on a web site and they work fine on a desktop screen. But they are proving problematic for smaller devices. Clicking on a link on a small screen device without hover functionality just brings up the tooltip instead of clicking through to the link destination. Is there a way to turn off or disable tooltips for smaller devices, perhaps using some kind of check in the jquery code?
You could do a check for touch events before calling the init on bootstrap tooltip
. This will allow you to disable the tooltip
feature for most touch devices not just smaller screen size touch devices like mobiles.
if(!('ontouchstart' in window))
{
$('#example').tooltip(options); // <-- Example code from Bootstrap docs
}