Menu
What is the data-selector option used for in Twitter's Bootstrap Tooltip? The description reads...
If a selector is provided, tooltip objects will be delegated to the specified targets.
But I don't understand its purpose or how to use it.
460
Basic Tooltip HTML: Use a container element (like <div>) and add the "tooltip" class to it. When the user mouse over this <div>, it will show the tooltip text. The tooltip text is placed inside an inline element (like <span>) with class="tooltiptext" .
To create a tooltip, add the data-toggle="tooltip" attribute to an element. Note: Tooltips must be initialized with jQuery: select the specified element and call the tooltip() method.
Bootstrap's interactive components—such as modal dialogs, dropdown menus and custom tooltips—are designed to work for touch, mouse and keyboard users.
As we mentioned in the preamble, tooltips are completely "mute" to any interactions as to not steal hover events from elements underneath them. Even placing interactive elements, such as links, into content of tooltip will not work.
It is the similar to using jQuery delegation methods like on() or delegate() in order to account for tooltip elements that aren't present in page when code is run.
Example binding to body since it is always present in page
$('body').tooltip({
selector: '.mytooltipClass'
})
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
