Bootstrap's tooltip plugin is an updated version of Jason Frame's jQuery.tipsy plugin. Tooltips can be used to provide users with additional information labels about specific content on your pages or provide insight into what input is expected in form elements.
Tooltips can be used on a variety of elements; for example, the following markup shows a tooltip when a user hovers over an anchor <a>
element:
<a data-toggle="tooltip" data-placement="top" data-original-title="Welcome to the wonderful World of Grammar!" href="#" >World of Grammar</a>
To use a tooltip on any element, add a data-toggle="tooltip"
attribute to it. You can specify the placement of the tooltip by setting the data-placement
attribute to one of the following values:
top
bottom
left
right
Finally, set the value of the data-original-title
attribute to specify what text should be shown inside the tooltip.
One caveat of tooltips is that because of performance concerns, the data-
API is opt-in, which...