Clean and Animated Tooltips with Pure CSS – Simptip

Category: CSS & CSS3 , tooltip | January 8, 2014
Author:
Views Total: 3,507
Official Page: Go to website
Last Update: January 8, 2014
License: MIT

Preview:

Clean and Animated Tooltips with Pure CSS – Simptip

Description:

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

You Might Be Interested In:


Leave a Reply