data-tip
<img src="http://r5.loli.io/aiYVJb.png" align="right" width="100">
Last updated 5 years ago by kchan .
ISC · Original npm · Tarball · package.json
$ cnpm install data-tip 
SYNC missed versions from official npm registry.

data-tip.css

Wow, such tooltip, with pure css!

Install

bower install data-tip
npm install data-tip

# additionally for Stylus lovers
# you can import data-tip.styl directly
@import '/path/to/data-tip'

Usage

Simply write like this in your HTML:

<button class="data-tip-bottom" data-tip="Tips To Show">
  My Custom Button
</button>

Position your tip:

data-tip-top
data-tip-bottom
data-tip-left
data-tip-right

Colorful your tip:

data-tip-success
data-tip-warning
data-tip-danger
data-tip-info

Anti-animation:

data-tip-no-animation

Rounded border:

data-tip-rounded

Fast mode:

data-tip-fast

Box with shadow:

data-tip-shadow

Always visible:

data-tip-visible

Why not hint.css?

hint.css is another great tooltip library, but it looks exactly like this:

hint.css

While I prefer to see that arrow in the center ;)

Development

Update data-tip.styl to change styles

command description
npm install install dependencies for dev
npm run build build html and css files
npm run dev build and watch file changes

Browser Support

Currently it works on IE 8+ and most modern browsers. It uses autoprefixer so just modify gulpfile.babel.js to suit your need.

License

MIT.

Current Tags

  • 0.0.52                                ...           latest (5 years ago)

8 Versions

  • 0.0.52                                ...           5 years ago
  • 0.0.51                                ...           5 years ago
  • 0.0.5                                ...           5 years ago
  • 0.0.4                                ...           5 years ago
  • 0.0.31                                ...           5 years ago
  • 0.0.3                                ...           5 years ago
  • 0.0.2                                ...           5 years ago
  • 0.0.1                                ...           5 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (0)
None
Dev Dependencies (13)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |