Hint.css is a simple CSS tooltip library which you can use to create cool tooltips for your website or web app. It is pure written in CSS and doesn’t uses any Javascript.
Hint.css in Action
Hint.css uses data-* attribute, pseudo elements, content property and CSS3 transitions to create the tooltips.
Browser Support
- Chrome – basic + transition effects
- Firefox – basic + transition effects
- Opera – basic
- Safari – basic
- IE 10+ – basic + transition effects
- IE 8 & 9 – basic
Usage
Firstly you need to include the library in document head:
Use any of the following position classes: hint–top, hint–bottom, hint–left, hint–right to position the tooltip.
Now add the tooltip text using the data-hint attribute on that element.
Hello Sir, hover me.