Show non-intrusive notifications ( like Growl on OSX ).
This will show gentle notifications in Growl like style, change the css ( or sass ) file to position and style the notification panel.
usage:
include the js with <script> tag as usual. ( will cause errors in IE < 9 )
or
include it conditionally like:
<!--[if lt IE 10]--><script>function notify(){ return false; }</script><!--[endif]-->
<!--[if gte IE 10]--><script src="js/moox.notifications.js"></script><!--[endif]-->
<!--[if !IE]--><script src="js/moox.notifications.js"></script><!--[endif]-->
this way, it will silently process the function calls in IE version 9 or below.
--
function: notify ( content , timeout , audio , callback );
- content , will hold the text you want to show in the notification ( basic html allowed )
- timeout , number of milliseconds the notification should be visible.
- audio , a boolean; to have audio notification chime, ( default: false )
- callback , function (as string) that needs to execute once notification is removed;
a callback can be cancelled by adding
<button onclick='event.target.offsetParent.cancelCallback();'>Cancel callback</button>to set content
by adding <span id='mn_countdown'></span> to the content text; it will insert the countdown in seconds into that element, showing the number of seconds until the notification is being removed.
Example content:
<div>This notification will close in <span id='mn_countdown'></span> Seconds</div>
Currently basic functionality. Check back later for cross browser support now supports ( FireFox, Chrome, Opera and IE10 or higher ) and more options like:
- sticky notifications
play audio upon showing notificationcallback upon removing notifications- style per notification
- etc. etc.
Example:
