Simple HTML5 Tooltip That Follows Cursor - jQuery light-tooltip

light-tooltip is a dead simple jQuery based HTML5 tooltip plugin that always follows your cursor and is easy to customize using your own CSS styles.

How to use it:

1. Download and insert the script tooltip.js into your document, after the latest jQuery library.

<script src="https://code.jquery.com/jquery-3.3.1.min.js" 
        integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" 
        crossorigin="anonymous">
</script>
<script src="tooltip.js"></script>

2. The plugin will append a tooltip to any DOM element using the data-tooltip attribute.

<div class="container">
  <button data-tooltip="This is a button">Button</button>
  <a data-tooltip="This is a link">Link</a>
  <img src="1.jpg" data-tooltip="This is an image">
  ...
</div>

3. Then apply your own CSS styles to the tooltip as these:

.div-tooltip {
  display: none;
  position: absolute;
  background-color: #000;
  padding: 10px;
  color: #fff;
  font-size: 12px 'Roboto';
  border-radius: 5px;
  /*
    more styles here
  */
}

---

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