Menu déroulant qui se replie après avoir été ouvert

[Indi31]

Bonjours

J'ai suivi le tutoriel https://forum.forumactif.com/t186834-scripts-installation-menu-deroulant qui marche très bien. Seulement, il y a une petite chose que j'aimerais changer : pour le moment, le menu déroulant reste déroulé même quand la souris n'est plus dessus (si vou voulez voir le problème, ici ). Or j'ai vu sur plusieurs forums des menu déroulant qui, une fois que la souris n'est plus dessus, sont à nouveau "enroulés".
Je sais pas si mon explication était très claire... En tout cas, j'aimerais savoir s'il existe un code (et si oui où l’insérer dans le css) afin que l'intérieur du menu déroulant disparaisse une fois qu'on ne passe plus la souris dessus.

Merci d'avance

[Ea]

Bonjour,


Il faudrait remplacer le :

Code:

<script type="text/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';}
}
//-->
</script><div id="menu">
   
<dl>         
<dt onmouseover="javascript:montre('smenu1');">A savoir</dt>
<dd id="smenu1">
<ul>
<li><a href="http://immortalis.forumgratuit.org/t1-scaena-le-concept">Contexte</a></li>
<li><a href="http://immortalis.forumgratuit.org/t9-reglement#14">Règlement</a></li>
<li><a href="http://immortalis.forumgratuit.org/t18-demandes-d-habitat#43">Habitat</a></li>
</ul>
</dd>
</dl>
   
   
<dl>   
<dt onmouseover="javascript:montre('smenu2');">Groupes</dt>
<dd id="smenu2">
<ul>
<li><a href="http://immortalis.forumgratuit.org/t2-immortalis#2">Servi Ombrae</a></li>
<li><a href="http://immortalis.forumgratuit.org/t2-immortalis#3">Patronum</a></li>
<li><a href="http://immortalis.forumgratuit.org/t2-immortalis#4">Pouvoirs des Immortels</a></li>
<li><a href="http://immortalis.forumgratuit.org/t2-immortalis#53">Humains</a></li>
</ul>
</dd>
 
</dl>
 
   
<dl>   
<dt onmouseover="javascript:montre('smenu3');">Personnages</dt>
<dd id="smenu3">
<ul>
<li><a href="http://immortalis.forumgratuit.org/t10-bottin-des-avatars#15">Avatars pris</a></li>
<li><a href="http://immortalis.forumgratuit.org/f4-postes-vacants">Postes vacants</a></li>
<li><a href="http://immortalis.forumgratuit.org/f5-scenarii">Scenarii</a></li>
</ul>
</dd>
</dl>
 
   
<dl>   
<dt onmouseover="javascript:montre('smenu4');">Invités</dt>
<dd id="smenu4">
<ul>
<li><a href="http://immortalis.forumgratuit.org/f10-questions">FAQ</a></li>
<li><a href="http://immortalis.forumgratuit.org/t11-nos-partenaires#16">Nos partenaires</a></li>
<li><a href="http://immortalis.forumgratuit.org/t13-demandes-de-partenariat#18">Devenir partenaires</a></li>
<li><a href="http://immortalis.forumgratuit.org/t12-nous-lier#17">Nous lier</a></li>
</ul>
</dd>
</dl>
   
 
</div>

Par :

Code:

<div id="menu">

   <dl>         
      <dt>A savoir</dt>
      <dd>
         <ul>
            <li><a href="/t1-scaena-le-concept">Contexte</a></li>
            <li><a href="/t9-reglement#14">Règlement</a></li>
            <li><a href="/t18-demandes-d-habitat#43">Habitat</a></li>
         </ul>
      </dd>
   </dl>   
   
   <dl>   
      <dt>Groupes</dt>
      <dd>
         <ul>
            <li><a href="/t2-immortalis#2">Servi Ombrae</a></li>
            <li><a href="/t2-immortalis#3">Patronum</a></li>
            <li><a href="/t2-immortalis#4">Pouvoirs des Immortels</a></li>
            <li><a href="/t2-immortalis#53">Humains</a></li>
         </ul>
      </dd>
   </dl>

   <dl>   
      <dt>Personnages</dt>
      <dd>
         <ul>
            <li><a href="/t10-bottin-des-avatars#15">Avatars pris</a></li>
            <li><a href="/f4-postes-vacants">Postes vacants</a></li>
            <li><a href="/f5-scenarii">Scenarii</a></li>
         </ul>
      </dd>
   </dl>
    
   <dl>   
      <dt>Invités</dt>
      <dd>
         <ul>
            <li><a href="/f10-questions">FAQ</a></li>
            <li><a href="/t11-nos-partenaires#16">Nos partenaires</a></li>
            <li><a href="/t13-demandes-de-partenariat#18">Devenir partenaires</a></li>
            <li><a href="/t12-nous-lier#17">Nous lier</a></li>
         </ul>
      </dd>
   </dl>
 
</div>

Et mettre le script :

Code:

$(function(){ $("#menu dl").hover(function(){$("#menu dl dd").slideUp("500");$(this).find("dd").stop(true,true).slideDown("500");},function(){$(this).find("dd").slideUp("500");}); });

Sur l'index ( voir les codes javascript ) et ça devrait donner ce que vous voulez.

Cordialement.

[Indi31]

Merci beaucoup ça fonctionne parfaitement