- PVSM.RU - https://www.pvsm.ru -

Noty.js V3 — шикарная javascript-библиотека для создания уведомлений. А также готовый плагин для vuejs

Noty.js V3 — шикарная javascript-библиотека для создания уведомлений. А также готовый плагин для vuejs - 1

Простая, бастрая и производительная библиотека для создания none-block уведомлений для вашего сайта или приложения.

О Noty.js V3

Привет Мир! Прошло много времени с момента написания первой [1] и единственной статьи на Хабре о notyjs. С 2012 года библиотека расширила свои возможности.

Сегодня она не зависит от jQuery, переписана на нативном JS.

import Noty from 'noty';
new Noty({
    text: 'Some notification text',
}).show();

Поддержка из коробки css библиотек animate.css [2], mojs [3], bounce.js [4], velocity [5] и других.

new Noty({
    text: 'Some notification text',
    animation: {
        open : 'animated fadeInRight',
        close: 'animated fadeOutRight'
    }
}).show();

Добавлен дизайн [6] уведомлений.

В версии 3.1 BETA появилась возможность создания Web Push [7] уведомлений и многое другое [8].

По прежнему имеет 11 мест размещения уведомлений и 5 типов самих уведомлений.

Небольшой бонус

Для тех, кто использует vuejs, предлагаю готовую обертку этой библиотеки vue-notice [9] с глобальным доступом из компонентов:

this.$notice.info("New version of the app is available!")

// или переопределить стандартные опции:
this.$notice.info("Hey! Something very important here...", {
  timeout: 6000,
  layout: 'topLeft'
})

Развернутая документация в описании репозитория.

Уверен, что для тех, кто еще с ней не знаком она во многом придется по вкусу.

Спасибо за внимание.

Автор: тащит всю команду

Источник [10]


Сайт-источник PVSM.RU: https://www.pvsm.ru

Путь до страницы источника: https://www.pvsm.ru/javascript/259943

Ссылки в тексте:

[1] первой: https://habrahabr.ru/post/149665/

[2] animate.css: https://github.com/daneden/animate.css

[3] mojs: https://github.com/legomushroom/mojs

[4] bounce.js: https://github.com/tictail/bounce.js

[5] velocity: https://github.com/julianshapiro/velocity

[6] дизайн: http://ned.im/noty/themes.html

[7] Web Push: http://ned.im/noty/web-push.html

[8] многое другое: http://ned.im/noty/options.html

[9] vue-notice: https://github.com/nikitamarcius/vue-notice

[10] Источник: http://habrahabr.ru/sandbox/110016/