Download Latest Version zebra-tooltips-1.0.zip (85.8 kB)
Email in envelope

Get an email when there's a new version of Zebra_Tooltips

Home
Name Modified Size InfoDownloads / Week
readme.md 2012-01-13 3.2 kB
zebra-tooltips-1.0.zip 2012-01-13 85.8 kB
Totals: 2 Items   89.0 kB 0

Zebra_Tooltips, a lightweight tooltips plugin for jQuery

Zebra_Tooltips is a lightweight (around 5KB minified, 1.6KB gzipped) jQuery plugin for creating simple, but smart and visually attractive tooltips, featuring nice transitions and offering a wide range of configuration options. The library detects the edges of the browser window and makes sure that the tooltips always stay in the visible area of the browser window by placing them beneath or above the elements and shifting them left or right so that the tooltips are always visible.

Besides the default behavior of tooltips showing when user hovers the element, tooltips may also be shown and hidden programmatically using the API. When shown programmatically, the tooltips will feature a “close” button and clicking it will be the only way of closing tooltips opened this way. This is very useful for drawing users’ attention to specific areas of a website.

By default, Zebra_Tooltips will use the “title” attribute of the element for the tooltip’s content, but the tooltip’s content can also be specified programmatically. Tooltips’ appearance can be easily customized both through JavaScript and/or CSS. Also, tooltips can be aligned left, center or right relative to the parent element.

Zebra_Tooltips makes use of NO IMAGES (uses CSS3 for rounded corners and drop shadow and falls back gracefully for browsers that don’t support CSS3) and the tooltips can be attached to any element not just anchor tags!

Works in all major browsers (Firefox, Opera, Safari, Chrome, Internet Explorer 6+)

Features:

  • lightweight (around 5KB minified, 1.6KB gzipped)
  • features nice transitions
  • detects the edges of the browser window and makes sure that the tooltips always stay in the visible area of the browser window by placing them beneath or above the elements and shifting them left or right so that the tooltips are always visible
  • tooltips may also be shown and hidden using the API
  • appearance can be easily customized both through JavaScript and/or CSS
  • tooltips can be aligned left, center or right relative to the parent element
  • makes use of NO IMAGES (uses CSS3 for rounded corners and drop shadow and falls back gracefully for browsers that don’t support CSS3)
  • can be attached to any element not just anchor
  • works in all major browsers (Firefox, Opera, Safari, Chrome, Internet Explorer 6+)

Requirements

Zebra_Tooltips has no dependencies other than jQuery. The recommended jQuery version is 1.7+ (due to the fact that the library makes use of something that the previous versions of jQuery have done in a way that it it now deprecated in WebKit powered browsers)


Useful links

How to use | Configuration | Download latest version | Changelog | Comments

Source: readme.md, updated 2012-01-13