Bonjour,
Pour prendre en charge des évènements coté client, j'ai pour habitude d'utiliser une fonction maison, nommée AddListener, fortement inspirée de ce que l'on peut trouver aisément sur le web.
Je souhaite l'utiliser pour qu'une bulle d'aide soit affichée au passage de la souris sur certains items de la page. Aussi je procède de la façon suivante :
AddListener( 'dg_ctl12_labCodeArticle', 'mouseover', BulleAfficher );
La fonction BulleAfficher ressemblant fortement à ceci :
Ce qui me chagrine, dans ce code, c'est que la bulle n'est plus correctement positionnée
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 function BulleAfficher( evt ) { var target = evt.target || evt.srcElement; ... var x = evt ? evt.clientX : window.event.clientX; var y = evt ? evt.clientY : window.event.clientY; ... // div_bulle == balise div contenant la "bulle" // balise obtenue par un moyen que je ne détaille pas içi // x est décrémenté de div_bulle.offsetWidth de sorte que le // coin haut droit de la bulle soit positionné à proximité du curseur x -= div_bulle.offsetWidth + 8; y += 6; ... div_bulle.style.left = x + 'px'; div_bulle.style.top = y + 'px'; div_bulle.style.visibility = 'visible'; }
Si l'utilisateur réduit la fenêtre de son navigateur de sorte qu'il lui faille utiliser son "ascenseur horizontal" pour rendre visible l'item dont le survol doit provoquer l'affichage de la bulle,
Alors la bulle n'est pas positionnée correctement (le calcul pour le left est 'faux' : il n'y a pas de prise en compte du scroll)
Avez-vous une solution à ce problème ?
Partager