timesout sur un menu en div

bonjour a tous,

J'ai construit un menu déroulant horizontal en full css (la seule couche de javascript sert a aider ie6 pour le hover)

J'aimerai savoir comment mettre un timesout sur ce menu pour que le sous menu ai un temps avant de disparaitre lorsque la souris n'est plus dessus

Voila mon code html

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
	<ul id="nav">
			<li><a href="#1">Configuration</a></li>
			<li><a href="#2">Accueil</a>
				<ul>
					<li><a href="#" class="sous_liste">MEA</a></li>
					<li><a href="#" class="sous_liste">Engagements</a></li>
					<li><a href="#" class="sous_liste">Marques</a></li>
				</ul>
			</li>
			<li><a href="#2">Catalogue</a>
				<ul>
					<li><a href="#" class="sous_liste">Marques</a></li>
					<li><a href="#" class="sous_liste">Produits</a></li>
					<li><a href="#" class="sous_liste">Animation<br />commerciale</a></li>
					<li><a href="#" class="sous_liste">Coupons</a></li>
					<li><a href="#" class="sous_liste">Assortiment</a></li>
				</ul>
			</li>

et mon javascript actuel

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
<script type="text/javascript">
<!--
sfHover = function() {
	var sfEls = document.getElementById("nav").getElementsByTagName("LI");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);//-->
</script>

merci par avance pour vos réponses.