Event et FF3 [Résolu]

Signaler
Messages postés
260
Date d'inscription
jeudi 31 mai 2007
Statut
Membre
Dernière intervention
5 novembre 2010
-
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
-
Bonsoir à tous !!

Je viens de tester la source : http://www.javascriptfr.com/tutoriaux/POSITION-SOURIS-DANS-PAGE_478.aspx

function WhereMouse( e ){
  var DocRef;    // Variable pour IE uniquement

  // L'événement est passée à la fonction
  // donc tous sauf IE…
  if(
e){                    
// Dans ce cas on obtient directement la position dans la page
    Mouse_X = e.
pageX ;
    Mouse_Y = e.
pageY;
  }
  else{                     
// Dans ce cas on obtient la position relative à la fenêtre d'affichage
    Mouse_X =
event .clientX;
    Mouse_Y =
event.clientY;




    //-- Il faut traiter le CAS des DOCTYPE sous IE
    if(
document.documentElement &&
document.documentElement.clientWidth) // Donc DOCTYPE
      DocRef =
document .documentElement;   // Dans ce cas c'est documentElement qui est réfèrence
    else
      DocRef =
document.body;                   
// Dans ce cas c'est body qui est réfèrence

    //-- On rajoute la position liée aux ScrollBars
    Mouse_X += DocRef.scrollLeft;
    Mouse_Y += DocRef.scrollTop;
  }
}

Il est dit que la variable e est passée pour tous les explorateurs, sauf IE. Or, sous Firefox 3, e n'existe pas non plus... Ce qui rend ce code inutilisable...

Quelqu'un aurait une idée de comment gérer ce probleme?

Merci d'avance et bonne soirée (bonne matinée en faite)

<hr />
lowke<sub>y
</sub>

7 réponses

Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Bonjour,
pour faire simple clientX et clientY renvoi la position par rapport à la fenêtre d'affichage qu'il y ai ou non un scroll en cours, c'est souvent l'erreur que font certains et lorsque le document est scrollé l'affichage, d'une infobulle par exemple, ne ce fait pas au bon endroit...
Pour t'en convaincre, dans l'exemple complet ci dessus, intégre clientY et clientX en lieu et place de ce qui existe et tu verras qu'au scroll ça bugue...

  var evt =  e || window.event;
  Mouse_X = evt.clientX;
  Mouse_Y = evt.clientY;
  var Obj = document.getElementById('D_INFO');
  Obj.style.left = Mouse_X +"px";
  Obj.style.top  = Mouse_Y +"px";  Obj.innerHTML  "X " +Mouse_X +"
Y = " +Mouse_Y;

;O)
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
pour être un peu plus complet FF intégre le scroll dans pageX et pageY, et comme tu peux le voir dans la fonction, on utilise clientX et clientY pour IE en ajoutant le décallage due au scrolling...

PS: Petole et non Petrole, j'ai toujours manqué d'R...
;O))
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
Bonjour,

    regarde ici         mais les exemples pullulent

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Bonjour,
...e n'existe pas sous FF3...,

en fait e représente l'événement qui est lié une fonction de gestion d'événement, c'est un paramètre qui est passé à de telle fonction par FF

Je pense que tu n'appelles ou n'utilises pas correctement la fonction
un petit exemple complet de l'utilisation de celle ci

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv= "Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
#D_MAIN {
  width : 2000px;
  height : 2000px;
}
#D_INFO {
  position : absolute;
  width : 100px;
  height : 50px;
  border : 1px solid red;
}
</style>
<script type="text/javascript">
var Mouse_X;
var Mouse_Y;
//----------------------
function WhereMouse( e ){
  var DocRef;    // Variable pour IE uniquement
  // L'événement est passée à la fonction
  // donc tous sauf IE.
  if( e){                    // Dans ce cas on obtient directement la position dans la page
    Mouse_X = e.pageX;
    Mouse_Y = e.pageY;
  }
  else{                      // Dans ce cas on obtient la position relative à la fenêtre d'affichage
    Mouse_X = event.clientX;
    Mouse_Y = event.clientY;
    //-- Il faut traiter le CAS des DOCTYPE sous IE
    if( document.documentElement && document.documentElement.clientWidth) // Donc DOCTYPE
      DocRef = document.documentElement;   // Dans ce cas c'est documentElement qui est réfèrence
    else
      DocRef = document.body;              // Dans ce cas c'est body qui est réfèrence
    //-- On rajoute la position liée aux ScrollBars
    Mouse_X + = DocRef.scrollLeft;
    Mouse_Y += DocRef.scrollTop;
  }
  //-- Juste pour l'exemple
  var Obj = document.getElementById('D_INFO');
  Obj.style.left = Mouse_X +"px";
  Obj.style.top  = Mouse_Y +"px";  Obj.innerHTML  "X " +Mouse_X +"
Y = " +Mouse_Y;
}
//-- l'evenement a observer
document.onmousemove = WhereMouse;
</script>
</head>

Position

</html>
à toi de jouer




;O)
Messages postés
260
Date d'inscription
jeudi 31 mai 2007
Statut
Membre
Dernière intervention
5 novembre 2010
1
Salut Petrole !

Effectivement, c'est moi qui ai mal compris.
Il y a juste une chose qui me dérange encore. Voila la fonction que j'avais faite :

function deplace(e)
{
        var evt =  e || window.event;
        var moveX = evt.clientX;
        var moveY = evt.clientY;
}

Or, d'apres la fonction, pour FF ou autre, il faut utiliser pageX; etpageY;. Mais meme sous FF mon moveX et moveY étaient bon.
pageX et pageY sont alors vraiment necessaires?

<hr />lowkeyhttp://s11.bitefight.fr/c.php?uid=45971
Messages postés
260
Date d'inscription
jeudi 31 mai 2007
Statut
Membre
Dernière intervention
5 novembre 2010
1
Merci pour les infos Petole !! (et désolé pour ton nick)
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
pas de mal et merci du retour...
;O)