Sarel
Sarel

Reputation: 1240

Bootstrap JS works, but not tooltip

I've confirmed that my bootstrap.js works by invoking a dropdown, and also a modal popup. Both of them work, but when I try to get tooltip to work it fails. As far as I understand from the documentation here you merely have to put this:

<a href="#" data-toggle="tooltip" title="" data-original-title="Default tooltip">you probably</a>

However, no tooltip appears at all. Yet, the dropdown that I invoke with the same API as below works:

<div class="dropdown">
    <a class="dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="/page.html">
        Dropdown
        <b class="caret"></b>
    </a>
    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
        ...
    </ul>
</div>

Upvotes: 0

Views: 486

Answers (1)

Bojangles
Bojangles

Reputation: 101543

You're using the tooltips incorrectly. You only need to provide the title attribute - the tooltip plugin sets the data-original-title itself.

Also, from the documentation:

For performance reasons, the tooltip and popover data-apis are opt in, meaning you must initialize them yourself.

So, do something like:

$('[data-toggle="tooltip"]').tooltip()

as a catch-all. You most likely want to select fewer elements to keep decent performance, though.

Upvotes: 4

Related Questions