Bootstrap Style Tooltip With jQuery - Tooltip.js

A tiny jQuery plugin that appends a Bootstrap-style tooltip to any elements without having to include the Bootstrap framework.

How to use it:

1. Load the minified version of the Tooltip.js plugin in the HTML document.

<link rel="stylesheet" href="jquery.tooltip.min.css" />
<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="jquery.tooltip.min.js"></script>

2. Add the data-toggle="tooltip" attribute to the target element and uses the title attribute to define the tooltip text as follows:

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

3. Determine the placement of the tooltip. Default: 'bottom'.

• top
• bottom
• left
• right

<button 
  data-toggle="tooltip" 
  title="Tooltip Content Here"
  data-placement="right"
  >Hover Me
</button>

---

This awesome jQuery plugin is developed by aprilsacil. For more Advanced Usages, please check the demo page or visit the official website.