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

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 le Jeu 30 Juin 2011 - 10:51

Bonjours

J'ai suivi le tutoriel http://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

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 le 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
Aidactif
Aidactif

Messages : 23429
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 le Mer 13 Juil 2011 - 11:12

cheers Merci beaucoup ça fonctionne parfaitement cheers

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