The tooltip plugin generates content and markup on demand, and by default places tooltips after their trigger element.
+Trigger the tooltip via JavaScript:
+{% highlight js %} +$('#example').tooltip(options) +{% endhighlight %} + +The required markup for a tooltip is only a data attribute and title on the HTML element you wish to have a tooltip. The generated markup of a tooltip is rather simple, though it does require a position (by default, set to top by the plugin).
Sometimes you want to add a tooltip to a hyperlink that wraps multiple lines. The default behavior of the tooltip plugin is to center it horizontally and vertically. Add white-space: nowrap; to your anchors to avoid this.
When using tooltips on elements within a .btn-group or an .input-group, you'll have to specify the option container: 'body' (documented below) to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip is triggered).
To add a tooltip to a disabled or .disabled element, put the element inside of a <div> and apply the tooltip to that <div> instead.
The tooltip plugin generates content and markup on demand, and by default places tooltips after their trigger element.
-Trigger the tooltip via JavaScript:
-{% highlight js %} -$('#example').tooltip(options) -{% endhighlight %} - -The required markup for a tooltip is only a data attribute and title on the HTML element you wish to have a tooltip. The generated markup of a tooltip is rather simple, though it does require a position (by default, set to top by the plugin).
Sometimes you want to add a tooltip to a hyperlink that wraps multiple lines. The default behavior of the tooltip plugin is to center it horizontally and vertically. Add white-space: nowrap; to your anchors to avoid this.
Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-animation="".