Comme faire dérouler une liste quand on survole un mot ou autre?
Résolu/Fermé
A voir également:
- Comme faire dérouler une liste quand on survole un mot ou autre?
- Liste déroulante excel - Guide
- Piratage facebook changer mot de passe - Guide
- Liste déroulante en cascade - Guide
- Mettre un mot de passe sur un dossier - Guide
- Remplacer un mot par un autre word - Guide
2 réponses
hack_net
Messages postés
783
Date d'inscription
lundi 5 mars 2007
Statut
Membre
Dernière intervention
5 juin 2014
51
26 févr. 2014 à 16:27
26 févr. 2014 à 16:27
Pas forcément besoin de JS... en css :
- Soit un élément caché d'astuce avec la classe .astuce
- Soit un span avec la classe show qui sert à montrer une astuce
CSS :
HTML :
Voilà :) L'enui de cette solution après c'est que lorsque le curseur quite la zonne du .show le .astuce disparait. Si tu veux vraiment du JS (je te montre avec jquery, plus simple) :
On garde les même classe et le même html.
Là, quand il survole .show l'astuce d'après ce montre, et s'il re survole ce .show, l'astuce d'après se cache.
- Soit un élément caché d'astuce avec la classe .astuce
- Soit un span avec la classe show qui sert à montrer une astuce
CSS :
.astuce{
display: none;
}
.show:hover + .astuce{
display: block;
}
HTML :
<span>Astuce #1</span>
<div class="astuce">
MON ASTUCE !
</div>
<span>Astuce #2</span>
<div class="astuce">
MON ASTUCE 2 !
</div>
<span>Astuce #3</span>
<div class="astuce">
MON ASTUCE 3 !
</div>
Voilà :) L'enui de cette solution après c'est que lorsque le curseur quite la zonne du .show le .astuce disparait. Si tu veux vraiment du JS (je te montre avec jquery, plus simple) :
On garde les même classe et le même html.
$(document).on("hover", ".show", function(){
$(this).next(".astuce').toggle("400");
});
Là, quand il survole .show l'astuce d'après ce montre, et s'il re survole ce .show, l'astuce d'après se cache.
