Looking for a notification system
<p><strong>UPDATE 3: SOLVED</strong></p>

<p><a href="http://jsfiddle.net/qTw9P/8/" rel="nofollow">http://jsfiddle.net/qTw9P/8/</a></p>

<pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt; 
&lt;html lang="en" xmlns="http://www.w3.org/1999/xhtml"&gt; 
    &lt;head&gt; 
        &lt;title&gt;&lt;/title&gt; 

        &lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"&gt;&lt;/script&gt;

        &lt;script type="text/javascript"&gt;
            $( document ).ready( function() {
                $( "#notifications" ).hide();

                var height = 0;
                var count = 0;

                $( "#show" ).click( function() {
                    count += 1;

                    $( "#notifications" ).append( "&lt;div class='notification' id='n" + count + "'&gt;&lt;span&gt;notification " + count + "&lt;/span&gt;&lt;input type='button' class='notification_button' id='b" + count + "' value='x' /&gt;&lt;/div&gt;" ).show();

                    height += $( "#n" + count ).height();

                    $( "#content" ).css( "padding-top", height + "px" );
                });

                $( ":button.notification_button" ).live('click', function() {
                    var number = parseInt( $(this).attr( "id" ).substring(1) );

                    height -= $( "#n" + number ).height();

                    $( "#content" ).css( "padding-top", height + "px" );

                    $( "#n" + number ).remove();
                });
            });
        &lt;/script&gt;

        &lt;style type="text/css"&gt;
            body {
                padding:0px;
                background-color:#00ff00;
            }

            #notifications {
                background-color:#ff0000;
                z-index:9999999;
                position:fixed;top:0px;left:0px;
                width:100%;
            }

            .notification {
                height:35px;
            }

            .notification_button {
                float:right;
            }
        &lt;/style&gt;
    &lt;/head&gt; 

    &lt;body&gt; 
        &lt;div id="notifications"&gt;&lt;/div&gt;

        &lt;div id="content"&gt;
            &lt;input type="button" id="show" value="show" /&gt;&lt;br /&gt;&lt;br /&gt;

            &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras fringilla metus nibh, sit amet posuere lectus. Donec neque elit, tristique eget aliquet a, sagittis ut massa. In vestibulum pellentesque massa sit amet ullamcorper. In eget diam eros, non volutpat purus. Maecenas aliquam ultricies tristique. Aliquam venenatis laoreet lectus et molestie. Fusce adipiscing molestie urna, sit amet fringilla sem ornare eu. Phasellus a felis ac quam consectetur scelerisque nec vitae est. In posuere malesuada aliquet. Nulla ultrices vulputate nisl et ullamcorper. Aliquam erat volutpat. Cras tortor justo, porta vitae eleifend sed, egestas non purus. Nullam massa odio, dapibus vitae hendrerit at, dictum et ante. Quisque condimentum justo eu arcu sodales vitae auctor massa aliquet. Vivamus tristique suscipit sem, id venenatis velit convallis id. Phasellus sit amet magna ut augue aliquam porttitor.&lt;/p&gt;

            &lt;p&gt;Sed vitae mauris nulla, at sagittis tellus. Proin dapibus congue massa non rutrum. In orci nulla, auctor vitae hendrerit id, mollis quis enim. Mauris blandit libero sed risus vulputate ornare vitae nec sapien. Sed eu ligula ut nulla faucibus sagittis non ac libero. Suspendisse laoreet bibendum consequat. Duis enim massa, rutrum ut iaculis quis, dignissim et neque. Quisque ac est felis, vel dapibus erat. Nulla facilisi. Nulla eros augue, ornare sit amet adipiscing vel, interdum ac dui. Aliquam orci risus, interdum cursus tincidunt quis, euismod sit amet sapien. Vivamus sollicitudin tempus risus, in ullamcorper lectus sagittis non. Phasellus nec gravida ante. Mauris vitae quam a nisl ornare rutrum.&lt;/p&gt;

            &lt;p&gt;Aliquam id neque ut dui placerat tincidunt. Nunc feugiat arcu sed risus dictum lacinia. Proin at purus eros. Sed adipiscing tincidunt nulla vitae molestie. Quisque sapien magna, molestie placerat tincidunt ut, porta eget arcu. Aliquam facilisis faucibus justo, ut placerat massa sagittis ut. Quisque ullamcorper lacinia tellus, nec mattis augue euismod sit amet. Nunc tristique congue odio ut consequat. Cras eget orci sed erat ullamcorper consectetur. Phasellus blandit, neque sit amet varius bibendum, ipsum purus vehicula tellus, at eleifend tortor turpis interdum erat. Quisque faucibus posuere accumsan. Fusce sem ipsum, tempus vel pharetra eleifend, scelerisque at justo. Nulla risus eros, faucibus iaculis sagittis nec, ultricies hendrerit neque.&lt;/p&gt;

            &lt;p&gt;Curabitur neque dolor, convallis in tempor eget, ultricies a massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed varius felis ut leo vehicula vehicula. Phasellus tellus mi, pretium ac vehicula non, convallis sed turpis. Nullam at auctor neque. Proin ac orci vel mauris mollis suscipit nec eget felis. Phasellus vel laoreet enim. Sed at mi in est feugiat suscipit non non mauris. Suspendisse vel enim lorem, et scelerisque quam. Aenean elementum elementum mi, quis dignissim dui rhoncus et. Integer viverra luctus vulputate. Maecenas nisi libero, pharetra id vestibulum eget, dignissim elementum ipsum. Vivamus quis eros nibh, in commodo ligula. Integer mi odio, fringilla sit amet sagittis sit amet, congue eget dui. Maecenas sollicitudin ante a nulla placerat congue. Integer interdum posuere diam a fringilla. Aenean accumsan orci nec sem aliquam elementum. Sed in quam eu urna lobortis eleifend. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.&lt;/p&gt;

            &lt;p&gt;Mauris pulvinar, nisi vitae facilisis fermentum, mi eros ultricies ipsum, non lacinia nunc turpis vel tortor. Nunc vel sapien ut diam porttitor euismod at quis tortor. Aenean quis lacus id dolor luctus eleifend in id arcu. Suspendisse potenti. Duis dui libero, dictum quis elementum eu, egestas ac dui. Maecenas egestas dapibus ipsum. Vivamus ut ipsum in tortor ultrices imperdiet. Etiam augue felis, gravida quis dictum at, tempus eget arcu. Duis elementum diam sit amet sapien luctus scelerisque. Proin non purus nulla. Cras vehicula, tellus vitae pellentesque sagittis, lectus nisl faucibus ligula, nec tincidunt risus elit luctus risus. Praesent sit amet commodo urna. Maecenas quis dui tellus, nec semper elit. Praesent porta, augue fringilla vehicula porta, diam lectus gravida sapien, sed molestie augue tellus in risus. Vivamus lectus dui, ultrices nec dapibus vitae, posuere eget velit. Donec scelerisque molestie lorem, in convallis justo consequat non. Sed sed enim eu nisl rutrum placerat.&lt;/p&gt;
        &lt;/div&gt;
    &lt;/body&gt; 
&lt;/html&gt; 
</code></pre>

<p><strong>UPDATE 2:</strong></p>

<p>I'm now adding div's to the top, but the content is not getting pushed down:
<a href="http://jsfiddle.net/qTw9P/7/" rel="nofollow">http://jsfiddle.net/qTw9P/7/</a></p>

<p>Not sure what I am doing wrong.</p>

<p><strong>UPDATE 1:</strong></p>

<p>The following jsfiddle works correctly interms of showing/hiding the notification which does not hide any of the content:</p>

<p><a href="http://jsfiddle.net/qTw9P/4/" rel="nofollow">http://jsfiddle.net/qTw9P/4/</a></p>

<p>However, when scrolling, the notification goes off the page, which scrolling, it should stay at the top of the visible page.</p>

<p><strong>ORIGINAL QUESTION:</strong></p>

<p>Can someone please point me to a notification system/plugin/tutorial which creates notifications similar to the notifications shown here at stackoverflow?</p>

<p>Basically, the notifications should be stackable, and they should not overlap the page, i.e. the actual page content moves down so nothing on the page gets covered by the notifications.  At the same time, the notifications should always remain at the top of the visible screen even when scrolling.  Basically, just how the stackoverflow notifications seem to work.</p>
