Menu déroulant en css + xHTML

Bonjour a tous,
grace au tuto http://css.alsacreations.com/Construction-de-menus-en-CSS/Un-menu-deroulant-en-CSS-et-XHTML-vertical-et-horizontal
je gère des menus depuis longtemps
je suis confronté à un soucis aujourd'hui
j'utilise la version suivante pour afficher mon menu http://css.alsacreations.com/xmedia/exemples/deroulant/menu-horizontal2.htm
hors je souhaiterais que la zone qui sert d'appel a ce sous menu reste "actif" pendant que je survole le sous menu correspondant
pour faire plus simple, j'ai un rollover sur le bouton du menu (avec un fond de couleur) et je voudrais que celui ci reste actif lors du survol du sous menu correspondant

voici mes codes :

        <ul id="menu">
          <li><a href="#">item</a></li>
          <li><a href="#">item</a></li>
		  <li><dl onmouseover="javascript:montre('ssmenuAcc');" onmouseout="javascript:enleve('ssmenuAcc');">
		  <dt id="metiers"><a href="metiers.html">item</a></dt>
		  <dd id="ssmenuAcc">
		  <p><a href="#">item</a> | <a href="#">item</a> | <a href="metiers.html">item</a> | <a href="#">item</a> | <a href="#">item</a></p>
		  </dd>
		  </dl></li>
          <li><a href="#">item</a></li>
          <li><a href="#">item</a></li>
</ul>

et le javascript

window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
	if (d) {d.style.display='block';}
}
function enleve(id) {
	var a = document.getElementById(id);
	if (a) {a.style.display='none';}
}

d'avance merci

Salut,

Au mouseover, il te faut appliquer une classe sur le premier élément dt de l'élément parent du dd (d.parentNode.getElementsByTagName('dt')[0].className) et la supprimer au mouseout.