Tipr

Tipr is a small and simple jQuery tooltip plugin

Download

Tipr

Tipr is a small and simple jQuery tooltip plugin. It works on almost any element, and it's free and open source.
Download
Version 2.0.1

Tipr is also on GitHub.

Demo

Hover over the Latin text below.
Odio nostrud
Ars Amatoria

Simple, small, flat, cool

Tipr displays attractive tooltips, and it's a shade over 3KB, CSS included. The tooltips can appear above or below almost any HTML element. Tipr is open source and released under the MIT License, and is compatible with all modern browsers.

Getting Started

Copy the tipr folder to your site and include the following in the <head> section of your page.
HTML
The first line loads jQuery via Google. The remaining lines load the Tipr CSS and the Tipr jQuery plugin.

Also included in the download package is tipr.min.js, a compressed release of the tipr.js plugin. You should use this if you don't intend to make any changes to the jQuery code.

Call the .tipr() method. Include this towards the end of the page.

HTML

Adding a tooltip

To add a tooltip to an HTML element, add the Tipr class. The data-tip data attribute contains the tooltip text.
HTML
Just about anything can have a tooltip.
HTML
You can stack the Tipr class, of course.
HTML

Options

The options for Tipr are set as arguments in the .tipr() method.
HTML
speed

The speed the tooltip displays, in milliseconds. The default is 200.

mode

The tooltip position, either top or bottom. The default is 'bottom'.

Overriding the mode inline

You can override the mode setting, and change the tooltip position, by using the data-mode data attribute.
HTML

Browser compatibility

Tipr works with Chrome 31+, IE9+, Firefox 35+, Safari 7.1+ and Opera 27+.

Support

We offer a range of flexible support plans for our jQuery plugins, including free.
© 2015, Tipue. Made in London.
PRIVACY
T&Cs