Lightweight and Skinnable jQuery Tooltip Plugin - Tips

File Size: 7.77KB
Views Total: 1780
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Lightweight and Skinnable jQuery Tooltip Plugin - Tips

Tips is a simple and easy to skin jQuery tooltip plugin that extracts tooltip text from 'title' or 'data-tip' attribute.


  • 5 built in themes: default, youtube, facebook, flat, and bootstrap.
  • Custom the tooltip potistions: bottom or top.
  • Lightweight and easy to implement.

How to use it :

1. Include the basic and a theme CSS files on your web page.

<link rel="stylesheet" type="text/css" href="lib/jquery-tips.css">
<link rel="stylesheet" type="text/css" href="lib/themes/flatui.css">

2. The html.

<a class="tip" data-tip="Tooltip from above" data-position="top">Above</a>
<a class="tip" data-tip="Tooltip from below" data-position="bottom">Below</a>

3. Include the jQuery javascript library and jQuery Tips plugin on the page.

<script src=""></script>
<script src="lib/jquery-tips.js"></script>

4. Call the plugin and you're doen.

$(document).ready(function() {

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