views:

25

answers:

1

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/

+1  A: 
...
<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(); })
Thomas Clayson
I can't seem to get the close function to work.
oshirowanen
`$('.notificationClose').click(function(){ $('this').parent().remove(); });` try that - the link has to be a direct decendent of the notification though.
Thomas Clayson