After Playing around with lots Growlesque plugins for jQuery, I came to the impression that whilst they mostly looked nice, they all were very bloated and difficult to customize.

So - of course - I rolled my own! Only this one is different. It's bit like a single scoop of momma's best homemade vanilla in a fancy ice creamshop: it doesn't have curvy corners, or callbacks, or other distractions. It's solid, works well, looks pretty decent and - oh - it's only 20 lines of code!

Being simple means it's very easy to understand and easy to change to your own tastes.

• include vanilla-notify.js
• depends on jQuery (1.3.2 tested)
• include the following CSS somewhere

#notify { position: absolute; position: fixed; width: 12em; top: 1em; right: 1em; color: black; }
#notify li { margin:0em; line-height: 1em; margin-bottom: 1em; list-style: none; padding: 0.5em 1em; background: #ddd; opacity: 0.85; cursor: pointer;} 
#notify .error  {background: #fcc;}

Uses the semi-standard $.notify

 $.notify('Hello') 

Can put any html inside

 $.notify('
Hello
Hi there 
') 

There is also a klass option, which adds the klass to the notification. This class can be used to style

 $.notify('With class: error', {klass: 'error' }) 

There's also a delay, which defaults to 5000. It's the time before the notification fades out. Set it to something big to make it sticky.

 $.notify("I'll be here for 7610.4 years!", { delay: 1e10 }) 

• Javascript File
• Github Project
• Issue Tracker
• Blog Post

Tested in

• Firefox 3.5
• Safari 4