I like the notification bars used in stackoverflow. I have found a jQuery plugin which makes the notification bar possible with just a few lines, but this plugin does not seem to stack multiple notifications bars when required.
Does anyone know of a better plugin or how to get the plugin below to stack bars as more notifications become available?
http://www.dmitri.me/blog/notify-bar/
...
<body>
<div id="notificationArea"></div>
<!-- rest of your website -->
</body>
</html>
Then to create notifications just do this in jquery:
$('#notificationArea').prepend('<div class="notification">This is my notification</div>');
its a bit basic, but this should do the trick, and because you are "prepending" you will get the stacking you are looking for. You can use append() too, but I was assuming you'd want the most recent notifications on the top.
To get the "X" (close) button just have a link in the notification with a class of notifcationClose and do:
$('.notificationClose').click(function(){ $('this').parents('.notification').remove(); })
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With