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 |
|
