Use:
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="transition-end.min.js"></script>
<script src="notification.menager.min.js"></script>
<link rel="stylesheet" href="notification.menager.css" type="text/css" media="screen" charset="utf-8"/>Init:
var notification = window.createNotification();
// default notification container <body>
var notification2 = window.createNotification({
container: $('#container')
});Add and also render message to notification:
**notification.addMsg(msg, dontRenderMessage)**
dontRenderMessage - Flag for adding the message without rendering it
// returns 'messageId' which is generated when not provided
var msgId = notification.addMsg({text:'A message', type:'alert'});
// Message only added but not rendered
var msgId2 = notification.addMsg({text:'Another msg', type:'alert'}, true);
notification.removeMsg({id: msgId});Message structure:
The system generates message id if not provided
{id: 'anId', text:'Example text', type: 'info'}type defaults: 'info', 'alert', 'err'
Add your own message type:
.mymsg{
fonte-weight: 300;
backgroud-color: orange;
} notification.addMsg({text:'A custom message', type:'mymsg'});Render notification:
notification.render(timeOut, onRenderCallback)
timeout - postpone render for a period of miliseconds
notification.render(300, function(instance){
instance.addMsg("Notification was rendered!");
});Render message:
// By id
notification.renderMsg({id: 'yuht658'}); // By index
notification.renderMsg({index: 5});Hide message:
notification.hideMsg({id: 'huuu777'});
notification.hideMsg({index: 2});Remove message:
notification.removeMsg({id: 'huuu777'});
notification.removeMsg({index: 1});Notification destroy:
notification.destroy(300, function(){
// on Destroy
});