Bonjour,
Je m'initie progressivement à Jquery et je rencontre là un petit problème que je n'arrive pas à résoudre. Il semblerait qu'un événement mouseover sur un <div> contenant une <img> soit exécuté deux fois d'affilée, en effet, je constate l'exécution du traitement :
- au passage de la souris sur le div (ok)
- et au passage de la souris sur l'image (pourquoi??)
Déjà, j'ai debuggé côté css,affiché mes bordures, vérifié que l'image était bien contenue dans le <div>, j'ai par ailleurs tenté quelques forcing css tels que display:inline, zoom:1 etc... sans trouvailles ni même côté javascript où chaque alerte renvoie le résultat escompté.
Détail du traitement :
J'ai plusieurs DIV ayant des textes descriptifs respectifs masqués que je souhaite afficher à chaque mouseover sur les DIV.
Voici mon script JS :
Un coup de main ?
Code : 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
21
22
23
24
25 <script> $(document).ready(function(){ $(".hello").each(function(){ // init de l'ID du DIV contenant le texte descriptif var theId = this.id+"Aide"; $(this).mouseover(function(){ // Masque tous les div contenant les textes $(".world").css('display','none'); // Affiche le div (le texte) correspondant au div survolé $("#"+theId).slideDown('fast'); }); }); }); </script> <!-- Mes div amorceurs --> <div class="hello" id="coucou1"> <div class="hello_img"><img src="image1.png" alt="" title="" /></div> </div> <div class="hello" id="coucou2"> <div class="hello_img"><img src="image2.png" alt="" title="" /></div> </div> <!-- Mes div descriptifs --> <div class="world" id="coucou1Aide">Texte descriptif 1</div> <div class="world" id="coucou2Aide">Texte descriptif 2</div>
Partager