Noty notifications
Noty is a jQuery plugin that makes it easy to create
alert - success - error -
warning - information -
confirmation messages as an alternative the
standard alert dialog. The API provides lots of other options to
customise the text, animation, speed, buttons and much more. It
also has various callbacks for the buttons such as opening and
closing the notifications and queue control.
| Notification layouts | ||
|---|---|---|
| Error notice |
Error notification. To use, add
type: 'error' option to the notification
configuration
|
|
| Success notice |
Success notification. To use, add
type: 'success' option to the notification
configuration
|
|
| Warning notice |
Warning notification. To use, add
type: 'warning' option to the notification
configuration
|
|
| Information notice |
Info notification. To use, add
type: 'info' option to the notification
configuration
|
|
| Alert notice |
Simple alert layout. To use, add
type: 'alert' option to the notification
configuration
|
|
| Confirmation dialog |
Confirmation dialog with buttons and callbacks. To use,
add type: 'confirm' option to the
notification configuration
|
|
| Notification position. Top | ||
| Top position |
Top notification position. To use, add
layout: 'top' option to the notification
configuration
|
|
| Top left position |
Top left notification position. To use, add
layout: 'topLeft' option to the
notification configuration
|
|
| Top center position |
Top center notification position. To use, add
layout: 'topCenter' option to the
notification configuration
|
|
| Top right position |
Top right notification position. To use, add
layout: 'topRight' option to the
notification configuration
|
|
| Notification position. Center | ||
| Center left position |
Center left notification position. To use, add
layout: 'centerLeft' option to the
notification configuration
|
|
| Center position |
Center notification position. To use, add
layout: 'center' option to the notification
configuration
|
|
| Center right position |
Center right notification position. To use, add
layout: 'centerRight' option to the
notification configuration
|
|
| Notification position. Bottom | ||
| Bottom left position |
Bottom left notification position. To use, add
layout: 'bottomLeft' option to the
notification configuration
|
|
| Bottom center position |
Bottom center notification position. To use, add
layout: 'bottomCenter' option to the
notification configuration
|
|
| Bottom right position |
Bottom right notification position. To use, add
layout: 'bottomRight' option to the
notification configuration
|
|
| Bottom position |
Bottom notification position. To use, add
layout: 'bottom' option to the notification
configuration
|
|
| Other examples | ||
| Overlay |
To display a dark page overlay when notification is
shown, set modal to true in
noty config
|
|
| Sticky |
Set timeout option to false to
disable timer. Progress bar will be also disabled
|
|
| Close button |
By default, notification is closable on click. To use
close button instead, use
closeWith: ['button'] option
|
|
| No progress |
Noty's progressBar option displays a
progress bar if timeout is not false. Set to
false to disable
|
|
| Custom background color |
To use a theme with custom background color, add
bg-[color] class to
theme option
|
|
