Use Pages Notification plugin that has been custom-made to suit overall theme, to add unique notifications of various styles
Show a sliding bar from top or bottom that fits the screen width
<script>
$(document).ready(function() {
// Apply the plugin to the body
$('body').pgNotification(options).show();
});
</script>
Name | Type | Default | Description |
---|---|---|---|
style | string | 'simple' | Sets the style of the notification. Styles available are 'bar', 'flip', 'circle', 'simple' |
message | string | null |
Message to be displayed inside the notification. |
position | string | 'top-right' |
Where to place the notification. Positions available are:
|
type | string | 'info' |
Sets the type of the notification - 'info', 'warning', 'success', 'danger'. Changing the type will change the background color and font color of the notification |
showClose | boolean | true |
Show/Hide the close button |
timeout | number | 4000 |
Decides for how long the notification should be visible on the screen in miliseconds. Setting timeout |
onShown | function | null |
Callback function fired after the notification is shown |
onClose | function | null |
Callback function fired after the notification is closed |
title | string | null |
Only available for style 'circle'. Sets the title of the notification |
thumbnail | string | null |
Only available for style 'circle'. Shows a thumbnail image together with the message Any <img width="40" height="40" style="display: inline-block;" src="assets/img/profiles/avatar2x.jpg" data-src="assets/img/profiles/avatar.jpg" data-src-retina="assets/img/profiles/avatar2x.jpg" alt="">
|