https://github.com/chemzqm/auto-tip

simple and smart tip component
https://github.com/chemzqm/auto-tip

Last synced: about 1 month ago
JSON representation

simple and smart tip component

• Host: GitHub
• URL: https://github.com/chemzqm/auto-tip
• Owner: chemzqm
• Created: 2016-03-12T17:32:02.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2016-06-29T15:40:18.000Z (over 8 years ago)
• Last Synced: 2024-11-14T08:16:02.657Z (about 1 month ago)
• Language: JavaScript
• Size: 39.1 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: Readme.md

Awesome Lists containing this project

README

        
# Auto-tip

A simple and smart tip component using [align](https://github.com/chemzqm/align)

[demo](http://chemzqm.github.io/auto-tip/)

## Install

    npm i auto-tip

## Example

``` html

+

```

``` js

var Tip = require('auto-tip')

var tip = Tip(el)

tip.show()

tip.hide() // tip.fade() to fade out

```

## API

### tip(el, [option])

Initialize tip element and optional option.

* `option.limit` the minimal margin betwwen el and viewport in pixeles

### .show([text], [offset])

Show with optional text and offset for [align](https://github.com/chemzqm/align).

### .hide()

Remove the tip.

### .fade()

Remove the tip with fade css classes, change classes `.tip-hide` to customized

it, default is:

``` css

.tip-hide {

  opacity: 0;

  -webkit-transform: translateY(-5px);

  -ms-transform: translateY(-5px);

  transform: translateY(-5px);

}

```

### .visible

Check if tip element visible.

## License

MIT