Discussion :

[SM_05]

Bonjour,
Je souhaite réaliser un menu accordéon qui se déplie au survol de la souris pour laisser apparaitre des boutons.
Je ne suis pas arrivé à le faire sans JS. Pb ,je ne connais pas le JS donc je rame un peu. J'ai trouvé des exemples en JS mais que pour du Onclick ( Je veux absolument du survol ).
Mes boutons sont de la forme :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<div class="cadre">
         <h4>Menu1</h4> 
                  <form action="page.php" method="POST"  >
                 <input  type="hidden" name="choix_accueil" value="valeur_a_envoyer1">
                 <input type="submit" name="Valider" value="Nom_bouton" class="bouton">
                 </form> 
 
                  <form action="page.php" method="POST"  >
                 <input  type="hidden" name="choix_accueil" value="valeur_a_envoyer2">
                 <input type="submit" name="Valider" value="Nom_bouton" class="bouton">
                 </form> 
 
        <h4>Menu2</h4> 
                 <form action="page.php" method="POST"  >
                 <input  type="hidden" name="choix_accueil" value="valeur_a_envoyer3">
                 <input type="submit" name="Valider" value="Nom_bouton" class="bouton">
                 </form> 
  </div>

Merci pour votre aide.

[NoSmoking]

Bonjour,

... Je veux absolument du survol ...

en modifiant légèrement la structure HTML tu peux résoudre cela en CSS.

Structure HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div class="cadre">
    <div class="over">
        <h4>Menu1</h4>
        <form action="page.php" method="POST">
            <input type="hidden" name="choix_accueil" value="valeur_a_envoyer1">
            <input type="submit" name="Valider" value="Nom_bouton" class="bouton">
        </form>
        <form action="page.php" method="POST">
            <input type="hidden" name="choix_accueil" value="valeur_a_envoyer2">
            <input type="submit" name="Valider" value="Nom_bouton" class="bouton">
        </form>
    </div>
    <div class="over">
        <h4>Menu2</h4>
        <form action="page.php" method="POST">
            <input type="hidden" name="choix_accueil" value="valeur_a_envoyer3">
            <input type="submit" name="Valider" value="Nom_bouton" class="bouton">
        </form>
    </div>
</div>

le CSS minimum est le suivant :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
.over form {
    display: none;
}
.over:hover form {
    display: block;
}

[SM_05]

C'est top, je ne pouvais pas rêver mieux.
Merci beaucoup !