Clean and Animated Tooltips with Pure CSS – Simptip

Simptip is a tooltip resolution built top of SASS to create clean and animated tootips with CSS3 transitions and transforms.

Basic Usage:

Include the minified version of simptip.css in the head section of your page.

<link rel="stylesheet" type="text/css" href="simptip-mini.css" media="screen,projection" />

Wrap your text using <span> element with data-tooltip attribute for the tooltip text. You can use class attribute to set the tooltip’s position, type and animation.

<span class="simptip-position-bottom simptip-success" data-tooltip="I'm a success tooltip">success</span>

Supported positions:

• simptip-position-top
• simptip-position-left
• simptip-position-right
• simptip-position-bottom