The Tooltip

About

The Tooltip is a handsome, modern gentleman that appears when it’s showtime.

Features

• 6 positions
• 12 color schemes
• gracefully degrades in older browsers
• LESS file included so you can:
  • create a custom color scheme
  • generate a compact production version of The Tooltip (less code)
  • mix it in your LESS stylesheet
• featured on 1stewebdesigner.com and tripwire magazine
• 1-minute integration

Example

Here’s a great implementation of The Tooltip: Rimfya (see the portfolio).

Compatibility table

Documentation

Preview the documentation

Do you have a question or suggestion? Let us know

Changelog

3.0

The Tooltip 3.0 is not backwards compatible with previous versions.

• Completely rebuild to be more efficient, performant and customizable
• Added bottom position
• Added support for keyboard focus
• Added support for touch devices (JavaScript file included)
• Added support for auto width (not compatible with center position) and full width
• Added and removed some color schemes
• All color schemes are now compliant to the AAA contrast ratio level
• Removed speech bubble feature (to focus completely on the tooltip part)

2.0

• 5 new color schemes in a different, dark style are added
• Compatible with more tooltip handles
• Dropped support for Internet Explorer 6
• Added support for new Webkit gradient syntax
• Improved documentation and examples