messg

Messages via CSS3 animations

  • messg

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
messg
2.2.16 years ago9 years agoMinified + gzip package size for messg in KB

Readme

Messages via CSS3 animations

Install

npm install --save messg

Usage

import messg from 'messg';

messg
  .success('Awesome!')
  .button('Ok');

API

messg(text, type, delay)

Create Message instance.

text

Type: string
Message text.

type

Type: string
Default: 'default'
Message type:
  • default
  • success
  • info
  • warning
  • error

delay

Type: number
Default: null
Аutohide timeout.

messg.default(text, delay)

messg.success(text, delay)

messg.info(text, delay)

messg.warning(text, delay)

messg.error(text, delay)

Aliases for messg(text[, type, delay])
messg.warning('Connection is lost');
messg.success('Task completed', 2500);

.button(name, fn)

Add button.

name

Type: string
Button title.

fn

Type: function
Handler for click on the button.
Buttons with handler:
messg
  .warning('Are you sure?')
  .button('Yes', () => {

  })
  .button('No', () => {

  });

Simple close button:
messg
  .success('Task completed')
  .button('Ok');

If buttons not specified, close message by clicking on it.

.hide(fn)

Add hide handler.

fn

Type: function
Handler for hide the message.
messg
  .warning('Hello!')
  .hide(() => {

  });

messg.clean()

Close all messages in flow.

Options

messg.speed

Type: number
Default: 250
Show and hide speed (ms).

messg.position

Type: string
Default: 'top'
Messages position:
  • top
  • top-left
  • top-right
  • bottom
  • bottom-left
  • bottom-right

messg.flow

Type: boolean
Default: true
Disable messages flow if false.

messg.max

Type: number
Default: null
Max flow length.

messg.delay

Type: number
Default: null
Global delay for all messages.

License

MIT