corner-notie

前端 提示 / 引导
一个简洁的消息提示组件
2017-12-05 我要评论 2 我要收藏

corner-notie

NPM version NPM download

A corner tip utility.

Install

Hot-link the IIFE version in your web page directly, CSS is automatically included.

or via NPM:

npm i -S corner-notie

Usage

// if you are using webpack/browserify
import notie from 'corner-notie'

notie('hello world')

// default options
notie('', {
  type: 'info', // info | warning | success | danger
  autoHide: true,
  timeout: 3000,
  position: 'top-right',
  width: 240
})

Positions

top-right | top-left | top-center
bottom-right | bottom-left | bottom-center

Click to hide notie

When autoHide is set to be false, you can click on the notie to hide it. In this way you may not want to hide notie when clicking on a href. Set attribute notie-prevent on that element to prevent from being hidden by clicking there.

notie('hello <a notie-prevent href="/u/egoist">egoist</a>', {
  type: 'success',
  autoHide: false
})

Development

# build for webpack and browser
# run this each time you want to make new release
npm run build
# run gulp for development
npm run dev

License

MIT.

corner-notie 相关推荐
对于该库,你有要推荐的内容么?点此提交推荐
请文明评论,与人为善,比聪明更重要!
评论