@ouduidui/notice NPM

NoticeKit

npm GitHub release (latest by date)

A lightweight small notice widget with no dependencies, create notifications easily with this javascript plugin. See demo.

dist/
├── notice.min.js

download releases to your project.

<script src="./notice.min.js"></script>

or npm install

npm i @ouduidui/notice

import Notice from "@ouduidui/notice";

const notice = new Notice();

Show loading animation.

notice.showLoading(options);

The options for loading. Check out the available options.

option	type	required	default	Description	options
type	`string`	`false`	`'line'`	the style type of loading animation	'line'、'dots'、'dots_zoom'、'cube_flip'、'dots_spin'、'cube_zoom'
color	`string`	`false`	`'#ffffff'`	color of loading animation and title	-
backgroundColor	`string`	`false`	`'rgba(0,0,0,.6)'`	color of mask	-
title	`string`	`false`	-	loading text	-
fontSize	`number`	`false`	16	font size of loading text	-

Preview other style types of loading animation by demo.

notice.showLoading({
  	type: 'dots',
    title: 'Loading',
    color: '#333',
    backgroundColor: 'rgba(255,255,255,.6)',
  	fontSize: 14
});

Close loading animation.

notice.hideLoading()

show a pop-up to remind something.

notice.showToast(options);

The options for showing toast. Check out the available options.

option	type	required	default	Description	options
Text	`string`	`true`	-	tips text	-
type	`string`	`false`	`'default'`	the style type of toast ('default' -- no icon)	'default'、'success'、'error'、'info'、'warning'
autoClose	`string`	`false`	`true`	auto close after 4 seconds	-
showClose	`string`	`false`	`false`	Show close button	-