<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
var t;
$('#ed1, #ed1pod').hover(function() {
clearTimeout(t);
$('#ed1pod').show();
}, function() {
t = setTimeout(function() {$('#ed1pod').hide();}, 2000);
});
});
</script>
<style>
#ed1 {
height: 20px; width: 150px;background-color: red;
}
#ed1pod {
height: 50px; width: 150px;background-color: black;display: none;
}
</style>
</head>
<body>
<div id="ed1">Наведи</div>
<div id="ed1pod"></div>
</body>
</html>
Пока курсор находится над #ed1 или #ed1pod, то #ed1pod будет виден, иначе через 2 секунды он будет скрыт.