tobento/js-notifier

Simple JavaScript notifier to show notifications.

Maintainers

Details

github.com/tobento-ch/js-notifier

Homepage

Source

Issues

Installs: 9

Dependents: 1

Suggesters: 0

Security: 0

Stars: 0

Watchers: 1

Forks: 0

Open Issues: 0

Language:JavaScript

1.0.1 2024-12-30 16:20 UTC

MIT ef9e98eec607af98694abbd0ef3c2efb0f7f58a7

notificationnotifiertobento

This package is auto-updated.

Last update: 2025-01-30 16:40:28 UTC

README

Simple JavaScript notifier to show notifications.

Table of Contents

Getting started

Browser support

Modern browser only.

Documentation

Basic Usage

1. Include CSS/JS

<link href="notifier.css" rel="stylesheet" type="text/css">

2. Import Notifier And Send A Notification

import notifier from "notifier.js";

const notification = notifier.send({
    status: 'success',
    title: 'Lorem',
    text: 'Lorem ipsum.',
});

Parameters

All parameters are optional but you must specify title or text at least.

Methods

import notifier from "notifier.js";

const notification = notifier.send({
    status: 'success',
    title: 'Lorem',
    autotimeout: null,
});

// close after 2000 milliseconds:
notification.close(2000);

Stacks

By default, notifications will be pushed to the default stack which will be positioned top right. You may create more stacks by the following way:

1. Create the CSS class

Name your class like .notification-stack-stack-name:

.notification-stack-secondary {
  position: fixed;
  bottom: 1rem;
  left: 1rem;
  z-index: 50;
  width: 400px;
}

2. Define the stack within you notifiaction

import notifier from "notifier.js";

const notification = notifier.send({
    stack: 'secondary',
    title: 'Lorem',
});

Credits