How to make use of it:

1. To get began, embrace the next information on the web page.

<link rel="stylesheet" href="dist/tooltip.min.css" />
<script src="dist/tooltip.min.js"></script>

2. Define the tooltip content material within the data-tooltip attribute:

<button data-tooltip="Tooltip Content">
  Hover Me
</button>

3. Determine at which level the tooltip should seem.

<button data-tooltip="Tooltip Content"
        data-tooltip-position="bottom">
  Hover Me
</button>

4. Determine the area between the tooltip and its trigger component.

<button data-tooltip="Tooltip Content"
        data-tooltip-margin="10">
  Hover Me
</button>

5. Config the tooltip animation.

<button data-tooltip="Tooltip Content"
        data-tooltip-enter-delay="0"
        data-tooltip-exit-delay="0"
        data-tooltip-show-duration="300"
        data-tooltip-hide-duration="200"
        data-tooltip-transition-distance="200">
  Hover Me
</button>

6. Set the z-index of the tooltip.

<button data-tooltip="Tooltip Content"
        data-tooltip-z-index="999">
  Hover Me
</button>

Tiny HTML5 Tooltip, Tooltip Plugin/Github

See Demo And Download