Sujet Précédent Sujet Suivant

Pb récupération position curseur

jlfcdvg Messages postés 39 Date d'inscription samedi 19 juillet 2003 Statut Membre Dernière intervention 13 octobre 2013 - 11 oct. 2006 à 08:02
cs_roro06 Messages postés 732 Date d'inscription jeudi 2 janvier 2003 Statut Membre Dernière intervention 29 octobre 2007 - 12 oct. 2006 à 12:55

Bonjour
Je voudrais soumettre ce problème à votre sagacité.
Sur une page destinée à un fichier d'aide au format chm, j'affiche une image dans une bulle
Mais il faut que l'image se mette à gauche ou à droite du curseur selon la position de celui-ci
sinon ça dépasse de la page.
Avant l'abscisse 500 je mets à droite et inversement
Voici le script ( il y a de la récup un peu partout sur le net !! )
<SCRIPT
LANGUAGE"JavaScript" type"text/javascript">
function
GetId(id)
{
return
document.getElementById(id);
}
var
i= false ;
// La variable i nous dit si la bulle est visible ou non

function
moveG(e) {
//Image ? gauche du curseur

if
(
i) {
// Si la bulle est visible, on calcul en temps reel sa position ideale

if
(navigator.appName! = "Microsoft Internet Explorer" ) {
// Si on est pas sous IE

GetId("curseur").style.left = e .pageX+10;
GetId("curseur").style.top = e.pageY+10;
}
else
{
GetId( "curseur" ).style.left = window .event.x-130;
GetId("curseur").style.top = window.event.y+10+document.body.scrollTop;
// Sous IE lors du scroll la position reste bonne !

}
}
}

function
moveD(e) {
//Image ? droite du curseur

if
(
i) {
// Si la bulle est visible, on calcul en temps reel sa position ideale

if
(navigator.appName!= "Microsoft Internet Explorer" ) {
// Si on est pas sous IE

GetId ("curseur").style.left =e.pageX+10;
GetId("curseur").style.top= e .pageY+10;
}
else
{
GetId( "curseur" ).style.left =window.event.x+10;
GetId("curseur").style.top= window .event.y+10+document.body.scrollTop;
// Sous IE lors du scroll la position reste bonne !

}
}
}

function
montre(text) {
if(
i == false ) {
GetId( "curseur" ).style.visibility ="visible";
// Si il est cach? on le rend visible.

GetId("curseur").innerHTML= text ;
i =true;
}
}
function
cache() {
if(
i= = true ) {
GetId( "curseur" ).style.visibility ="hidden";
// Si la bulle etait visible on la cache

i= false ;
}
}
</SCRIPT>
</HEAD>

<SCRIPT LANGUAGE ="JavaScript">
function
position(e) {
//Pour r?cup?rer la position du curseur

var
x= event .x+document.body.scrollLeft;
var
y =event.y+document.body.scrollTop;
window.status= "Souris x:" + x +" | y:"+y;
}
document.onmousemove =position;

if(
x>500) {
document.onmousemove= moveG ;
}
else
{
document.onmousemove =moveD;
}
</SCRIPT>

C'est au niveau de la condiftion "if x>500" que ça ne fonctionne pas
ERREUR : x est indéfini
La bulle s'affiche toujours en haut et à gauche de la page
Quelqu'un a t'il une idée sur la question ?
D'avance merci.
jlfcdvg

A voir également:

Pb récupération position curseur
Curseur sql - Conseils pratiques -SQL
Position lettre alphabet - Forum Visual Basic
Problèmes de récupération ✓ - Forum PHP
Convertir un mot en chiffres avec poistion des lettres dans l'alphabet ✓ - Forum Java
Incrementer une lettre de l'alphabet ✓ - Forum Visual Basic

9 réponses

Réponse 1 / 9

cs_roro06 Messages postés 732 Date d'inscription jeudi 2 janvier 2003 Statut Membre Dernière intervention 29 octobre 2007
11 oct. 2006 à 08:53

Bonjour

x étant déclarée à l'intérieur de la fonction position, c'est une variable locale( connue uniquement de la fonction position, et redéclarée à chaque appel).
Solution :

var x;
function position(e){
x=event.x+document.body.scrollLeft;
etc ...

comme tu avais fait pour i
(idem, évidemment pour y)

Cordialement
Roro webDev

Réponse 2 / 9

jlfcdvg Messages postés 39 Date d'inscription samedi 19 juillet 2003 Statut Membre Dernière intervention 13 octobre 2013
11 oct. 2006 à 09:19

Bonjour
Merci pour la réponse
Je n'ai plus d'erreur mais la vignette reste à droite même si le curseur est >500,
comme si la condition if (x>500) ... etc n'était pas prise en compte
jlfcdvg

Réponse 3 / 9

cs_roro06 Messages postés 732 Date d'inscription jeudi 2 janvier 2003 Statut Membre Dernière intervention 29 octobre 2007
11 oct. 2006 à 09:38

Bonjour

Il se trouve que tu as deux fois document.onmousemove sur ta page : c'est une de trop. Voir attachEvent ici :
http://www.aidejavascript.com/article143.html

Cordialement
Roro webDev

Réponse 4 / 9

jlfcdvg Messages postés 39 Date d'inscription samedi 19 juillet 2003 Statut Membre Dernière intervention 13 octobre 2013
11 oct. 2006 à 12:09

Merci de te pencher sur mon problème
J'ai essayé AttactEvent mais ça fait la même chose
Voici mon code modifié

<SCRIPT
LANGUAGE"JavaScript" type"text/javascript">
functionGetId
(id
)
{

returndocument
.getElementById
(id
);
}

vari
= false ;
// La variable i nous dit si la bulle est visible ou non

functionmoveG
(e
) {
//Image ? gauche du curseur

if(i
) {
// Si la bulle est visible, on calcul en temps reel sa position ideale

if
(navigator
.appName
! = "Microsoft Internet Explorer"
) {
// Si on est pas sous IE
GetId
("curseur"
).style
.left
= e
.pageX
+10;
GetId
("curseur"
).style
.top
= e
.pageY
+
10;
}

else {
GetId
( "curseur"
).style
.left
= window
.event
.x
-130;
GetId
("curseur"
).style
.top
= window
.event
.y
+10
+document
.body
.scrollTop
;
// Sous IE lors du scroll la position reste bonne !
}
}
}

functionmoveD
(e
) {
//Image ? droite du curseur

if(i
) {
// Si la bulle est visible, on calcul en temps reel sa position ideale

if
(navigator
.appName
!= "Microsoft Internet Explorer"
) {
// Si on est pas sous IE
GetId
("curseur"
).style
.left
=e
.pageX
+10;
GetId
("curseur"
).style
.top
= e
.pageY
+
10;
}

else {
GetId
( "curseur"
).style
.left
=window
.event
.x
+10;
GetId
("curseur"
).style
.top
= window
.event
.y
+10
+document
.body
.scrollTop
;
// Sous IE lors du scroll la position reste bonne !
}
}
}

functionmontre
(text
) {

if(x
>500) {
document
.onmousemove
=moveG
;
}

else {
document
.onmousemove
= moveD
;
}

if(i
== false ) {
GetId
( "curseur"
).style
.visibility
="visible"
;
// Si il est cach? on le rend visible.
GetId
("curseur"
).innerHTML
= text
;
i
=true;
}
}

functioncache
() {

if(i
= = true ) {
GetId
( "curseur"
).style
.visibility
="hidden"
;
// Si la bulle etait visible on la cache
i
= false ;
}
}

varx
;

vary
;

functionposition
(e
) {
//Pour r?cup?rer la position du curseur
x
=event
.x
+document
.body
.scrollLeft
;
y
=event
.y
+document
.body
.scrollTop
;
}
</SCRIPT>
Merci

jlfcdvg

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 9

cs_roro06 Messages postés 732 Date d'inscription jeudi 2 janvier 2003 Statut Membre Dernière intervention 29 octobre 2007
11 oct. 2006 à 12:49

Bonjour

Arrhhh Que voila une affaire bien compliquée !

Beaucoup plus simple :
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
var xMouse, yMouse;

var xSpacer=0;
var ySpacer=10;
function posSouris(e)
       {       xMouse (navigator.appName.substring(0,3) "Mic") ? event.x+document.body.scrollLeft : e.pageX ;       yMouse (navigator.appName.substring(0,3) "Mic") ? event.y+document.body.scrollTop : e.pageY ;

    xSpacer=(xMouse>500)?-150:10;

    if (document.getElementById("divMsg"))
        {
        document.getElementById("divMsg").style.top = yMouse + ySpacer;
        document.getElementById("divMsg").style.left = xMouse + xSpacer;
        }
    }

(navigator.appName.substring(0,3) == "Mic")    ? window.document.attachEvent("onmousemove", posSouris) : window.addEventListener("mousemove", posSouris, false);


</script>
</head>

</html>

Une fonction, un écouteur, et hop !
A adapter à tes besoins, naturellement

Cordialement
Roro webDev

Réponse 6 / 9

jlfcdvg Messages postés 39 Date d'inscription samedi 19 juillet 2003 Statut Membre Dernière intervention 13 octobre 2013
11 oct. 2006 à 17:17

Bonjour

Effectivement c'est beaucoup plus simple
Mais comment faire en sorte qu'une image différente apparaisse au lieu du rectangle noir ?
Voici un extrait de ma page

<MAP

NAME= "ListingType">

</MAP>

ALIGN ="CENTER">

C'est la fonction montre() qui permet d'afficher une image dans une popup quand la souris survole un certain endroit de l'écran.

Cordialement
jlfcdvg

Réponse 7 / 9

cs_roro06 Messages postés 732 Date d'inscription jeudi 2 janvier 2003 Statut Membre Dernière intervention 29 octobre 2007
12 oct. 2006 à 09:42

Bonjour

ben au lieu de:

(c'est mon rectangle noir!) tu mets ce que tu veux. par exemple :

id="divMsg" style="position:absolute">

Cordialement
Roro webDev

Réponse 8 / 9

jlfcdvg Messages postés 39 Date d'inscription samedi 19 juillet 2003 Statut Membre Dernière intervention 13 octobre 2013
12 oct. 2006 à 12:17

Bonjour
Ca marche !
Mais je ne vois pas comment mettre une image différente selon que la souris survole une zone AREA d'une image ou bien une autre par la méthode onmouseover .
Merci
jlfcdvg

Réponse 9 / 9

cs_roro06 Messages postés 732 Date d'inscription jeudi 2 janvier 2003 Statut Membre Dernière intervention 29 octobre 2007
12 oct. 2006 à 12:55

Bonjour

etc ...

(d'autres solutions sont possibles)

Cordialement
Roro webDev

Discussions similaires

Problème curseur personalisé

Récupération nom de serveur

générer une position aléatoire

recuperer un objet

Curseur

Votre réponse

Discussions similaires