...data-toggle="tooltip">and ..data-original-title="Tooltip left">to the button element.
CSS Classes: .theme-tooltip
Change the color theme to see how the tooltip changes:
CSS Classes: .default-tooltip, .primary-tooltip, .info-tooltip, .success-tooltip, .warning-tooltip, .danger-tooltipor .inverse-tooltip.
...data-toggle="popover">and ...data-content="Lorem ipsum dolor sit amet">to the popover button.
CSS Classes: .popover-sm
...data-trigger="hover">to the popover button.
CSS Classes: .theme-popover
Change the color theme to see how the popover changes:
Only works without ...data-container="body">.
CSS Classes: .default-popover, .primary-popover, .info-popover, .success-popover, .warning-popover, .danger-popoveror .inverse-popover.
...data-html="true">to the button element.
...title="<b>Popover HTML Example</b>- Title"and ...data-content="<div>Popover HTML Example - Content</div>"to the button element.$('#popoverHTML').popover({
html : true,
content : function() {
return $('#popoverHTMLHiddenContent').html();
},
title : function() {
return $('#popoverHTMLHiddenTitle').html();
}
});