Angular Tooltips

A Angular tooltip plugin is a small pop-up element that appears while the user moves the mouse pointer over an element.
Keep reading these examples for adding custom tooltips with CSS and JavaScript using CSS3 for animations and data-attributes for local title storage.

Example

Tooltip on top Tooltip on right Tooltip on bottom Tooltip on left

<button type="button" class="btn btn-sm btn-white" placement="top" ngbTooltip="Tooltip on top">
  Tooltip on top
</button>
<button type="button" class="btn btn-sm btn-white" placement="right" ngbTooltip="Tooltip on right">
  Tooltip on right
</button>
<button type="button" class="btn btn-sm btn-white" placement="bottom" ngbTooltip="Tooltip on bottom">
  Tooltip on bottom
</button>
<button type="button" class="btn btn-sm btn-white" placement="left" ngbTooltip="Tooltip on left">
  Tooltip on left
</button>