Can bootstrap tooltips be turned off based on device screen size?

Question

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?

Answer 1

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
}

Answer 2

Maybe something like this:

if ( $(window).width() < 780 ){
    $('#element').tooltip('destroy');
}