Animated Popup Tooltip Plugin with jQuery

File Size: 14.5 KB
Views Total: 5831
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Animated Popup Tooltip Plugin with jQuery

Popup Tooltip is a jQuery plugin that helps you create animated & closeable tooltips appending to the Html elements on page load. Supports 4 directions (top, right, bottom and left) and fade-in animations.

How to use it:

1. Load the required style.css for basic tooltip styles.

<link rel="stylesheet" href="style.css">

2. Load the jQuery popup tooltip plugin's script after jQuery library.

<script src="//code.jquery.com/jquery-1.11.1.js"></script>
<script src="jquery.popuptooltip.js"></script>

3. Create a popup tooltip for your Html element 'demo'.

// $.fn.popupTooltip(side, text);

$(function() {
  $('#demo').popupTooltip('bottom','Tooltip text here');
});

Change log:

2014-11-29

  • New trigger "hide";
  • Added new sides: "top-left", "top-right", "right-top", "right-bottom", "bottom-left", "bottom-right", "left-top", "left-bottom";
  • Redesigned example page;
  • Added minified .js and .css.

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