strengerst,
но нужен mouseenter и mouseleave чтобы воспользоваться таким меню
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
#example{
position: relative;
}
</style>
</head>
<body>
<ul><a href="#" onmouseover="hou(0)" onmouseout="hou(-500)" >Меню</a>
<ul id="example" style="top: -500px">
<li >Меню 1</li>
<li>Меню 2</li>
<li>Меню 3</li></ul></ul>
<script>
var g;
function hou(to){
window.clearTimeout(g)
function delta(progress) {
return progress;}
var element = document.getElementById("example");
var from = parseFloat(element.style.top) ; // Начальная координата X
//var to = to; // Конечная координата X
var duration = 1000; // Длительность - 1 секунда
var start = new Date().getTime();// Время старта
g = setTimeout(function() {
var now = (new Date().getTime()) - start;// Текущее время
var progress = now / duration; // Прогресс анимации
var result = (to - from) * delta(progress) + from;
element.style.display="block";
element.style.top = result + "px";
if (progress < 1) // Если анимация не закончилась, продолжаем
setTimeout(arguments.callee, 10);
}, 10);}
</script>
</body>