Usage Rules: Popovers activate on click and tooltips activate on hover. Popovers should appear only one at a time. If an icon or button is clicked that should display a popover, any already visible popover should close. If the content is more than two lines long, use a popover. Otherwise use a tooltip. There can be no text formatting in a popover or a tooltip. If your content is longer than a short paragraph or you require text formatting, you should use a modal.
bootstrap.min.js and also include the jQuery code
Popovers should appear on click only. They should automatically appear to the immediate top, right, left, or bottom of the link or linked image or icon. The link used is commonly "help_outline", as in the examples below. A popover's content is text only. If you need to use HTML in the content or the content is longer than a short paragraph, you should be using a Modal instead.
Click an icon below to view the popover.
A tooltip should appear on hover only. It should automatically appear to the immediate top, right, left, or bottom of the link or linked image or icon. A tooltip's content is text only and should be no longer than a sentence or two. If the content is longer, use a Popover instead. If the content requires HTML, a Modal is your best option.
Hover over an icon below to view the tooltip. (Touch on mobile)