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

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

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

Message par Indi31 Jeu 30 Juin 2011 - 10:51

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 Very Happy


Dernière édition par Indi31 le Mer 13 Juil 2011 - 11:12, édité 1 fois
avatar

Indi31
Nouveau membre

Messages : 15
Inscrit(e) le : 10/05/2011

http://secret-of-stonehenge.forumgratuit.org
Indi31 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant qui se replie après avoir été ouvert

Message par Ea Jeu 7 Juil 2011 - 16:12

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.
Ea

Ea
Aidactif
Aidactif

Messages : 23583
Inscrit(e) le : 04/04/2008

Ea a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Menu déroulant qui se replie après avoir été ouvert

Message par Indi31 Mer 13 Juil 2011 - 11:12

cheers Merci beaucoup ça fonctionne parfaitement cheers
avatar

Indi31
Nouveau membre

Messages : 15
Inscrit(e) le : 10/05/2011

http://secret-of-stonehenge.forumgratuit.org
Indi31 a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum