Pure HTML5 / CSS3 Tooltips – Showet

Preview:

Description:

Showet is a really lightweight CSS library that creates unobtrusive, clean tooltips on any DOM elements using html5 data attributes and CSS :before, :after pseudo elements.

How to use it:

Load the showet.css in the head section of the web page.

<link href="css/showet.css" rel="stylesheet">

Use the data-tooltip to specify the tooltip content for your DOM elements.

<a href="#" class="link" data-tooltip="This is a sample tooltip!">Hover Me</a>

That’s it.