How do I make my “alert bar” push down everything of my website?

lisasand

New Member
I wrote an alert bar like this:\[code\]alertmsg{ font-family:Arial,Helvetica,sans-serif; font-size:135%; font-weight:bold; overflow: hidden; width: 100%; text-align: center; position: fixed; top: 0px; left: 0px; background-color: #fff; height: 56px; color: #000; font: 20px/40px arial, sans-serif; display:none; padding-top:12px; -webkit-box-shadow: 3px 3px 5px #888; -moz-box-shadow: 3px 3px 5px #888; box-shadow: 3px 3px 5px #888;}function alertbar(m, timeout){ if(!timeout){ var timeout = 3000; } var $alertdiv = $('<div id = "alertmsg"/>'); $alertdiv.text(m); $alertdiv.bind('click', function() { $(this).slideUp(200); }); $(document.body).append($alertdiv); $("#alertmsg").slideDown("slow"); setTimeout(function() { $alertdiv.slideUp(200) }, timeout); return false}\[/code\]Pretty simple. I call \[code\]alertbar("Go go go!");\[/code\] to have this alert drop down.However, it covers the body's page. I want it to sort of "push down" on the entire page (all the elements)....sort of like StackOverflow does it I guess.
 
Top