qtip

pretty, mobile-friendly tooltips

qtip

pretty, mobile-friendly tooltips.

http://performancejs.com/qtip/demo/

  • tiny (.5k gzipped), no dependencies
  • pretty, stylable via CSS
  • semantic (augments existing title attributes), uses CSS for styling
  • supported environments: AMD, CommonJS, browser globals

installation is nearly drop-in. just add empty data-qtip attributes to any elements with existing title attributes that you'd like to style. then attach qtip.js to the bottom of your page (it will self-initialize).

<html>
<head>
...
</head>
<body>
 
<span title="some text here" data-qtip></span>
 
<a title="more text" data-qtip href="#"></span>
 
...
 
<script src="qtip.js"></script> 
 
</body>
</html>
# install build dependencies
npm install
 
# build css
stylus stylus --out css
 
# build js
grunt