5

I'm using Bootstrap 3 tooltips, used the examples from the docs, but the problem is they show up automatically at start, when the page is loaded all the tooltips are visible!

i want them to show only on hover, what should I do?

daniula
  • 6,898
  • 4
  • 32
  • 49
yazfield
  • 1,233
  • 11
  • 18
  • possible duplicate of [Twitter Bootstrap Tooltips on Hover & Focus](http://stackoverflow.com/questions/13572737/twitter-bootstrap-tooltips-on-hover-focus) – Dan Jul 24 '14 at 18:03
  • No duplicates in my code, I was using HTML data properties to show tooltips, i switched to showing them using JavaScript and now it works just fine, however in the docs, they you can use HTML data properties, weird! Thanks – yazfield Jul 24 '14 at 18:27
  • 2
    there must be something else going on (but without your code and more info can't tell), because data properties tooltips should not do this either. – Shawn Taylor Jul 24 '14 at 18:35
  • Show your code to help you quick. – Arun_SE Jul 25 '14 at 09:55

2 Answers2

4

You can do like this 

$(function () {
    $('[data-toggle="tooltip"]').tooltip("show");
    $('[data-toggle="tooltip"]').find(".tooltip.fade.top").removeClass("in");
 });

or

$(function () {
    $('[data-toggle="tooltip"]').tooltip("show");
    $(".tooltip.fade.top").remove();
 });

For Html :

<a href="#" data-toggle="tooltip" title="This is tooltip !">Hover over me</a>

Pranav Labhe
  • 1,943
  • 1
  • 19
  • 24
2

I think you trigger bootstrap tooltip in document ready like this,

$('#id').tooltip('show');

Try to change like this

$('#id').tooltip();

Hope this will work

Arun_SE
  • 230
  • 1
  • 13