<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div id="im" style="z-index:222;position:fixed;top:-65px;left:0;
width:250px;height:65px;
color:#fff;
border:1px solid #4767AB;
text-shadow: 1px 1px 1px #000;
background:#4c83c3;box-shadow:0 0 2px rgba(0,0,0,0.9);">
НОВОЕ СООБЩЕНИЕ<br>
От<br>
Пан или пропал
</div>
<script>
var element = document.getElementById("im");
function animate(el, to, time) {
var top = el.offsetTop,
last = +new Date(),
tick = function() {
top += (new Date() - last)*to / time ;
last = +new Date();
if (top < 500) {
(window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16)
}
else {top = to};
el.style.top = top + "px" ;
};
tick()}
animate(element, 500, 800);
</script>
</body>
</html>