[Javascript] Librairie de compatibilité

Version imprimable

18/08/2004, 22h00
Sub0

[Javascript] Librairie de compatibilité

Salut! ;)

Je développe depuis 3 ou 4 mois avec Javascript, et j'ai été surpris par les nombreux problèmes de compatibilité entre les navigateurs. Je propose de développer une librairie afin d'obtenir une banque de fonctions standards compatibles avec les différents navigateurs. Un exemple des fonctions recherchées:

- GetBrowser (type et la version du navigateur)
- GetMousePos (position de la souris)
- GetScrollPos (position du scroll)
- GetWinDim (dimensions de la page)
- Set & GetVisibility (status du style visibility)
- etc...

Ce projet permettrait de ne plus se soucier de la compatibilité des fonctions.
Que pensez-vous du projet?

Merci de votre participation!
19/08/2004, 15h10
Albus

C'est un super projet !! :D
C'est vrai que c'est vraiment ennuyeux de programmer en javascript un script qui soit compatible avec les differents navigateurs.
Je te souhaite vraiment de mener a bien ton projet, car c'est un projet "utile" contrairement a beacoup d'autre 8O

Par contre, ne compte pas sur moi pour t'aider car j'ai enormement de projet a terminer (le projet calto par exemple que je relancerais a la rentree).

La 1ère fonction, détecter l'OS du client:
Code:

1 2 3 4 5 6 7 8 function Plateforme(){ if(navigator.appVersion.indexOf("Win")>-1) return"Windows"; if(navigator.appVersion.indexOf("Macintosh")>-1) return"Macintosh"; if(navigator.appVersion.indexOf("X11")>-1) return"Unix"; if(navigator.appVersion.indexOf("Unix")>-1) return"Unix"; if(navigator.appVersion.indexOf("Linux")>-1) return "Unix"; return "Unknown"; }
La seconde fonction est impressionante!
Il sagit de détecter le navigateur du client. Elle intègre aussi le code pour obtenir l'OS utilisé:
http://sub0.developpez.com/javascript/detect.js.txt

Seulement, je préfère détecter le navigateur du client comme ceci:
Code:

1 2 3 4 5 6 7 8 var ns4=document.layers; var ie4=document.all; var ns6=document.getElementById && !document.all; if(ns6){ // Navigateur Netscape 5 et plus et DOM-1. }else if(ns4){ // Navigateur Netscape 4.7 et moins. }else if(ie4){ // Internet Explorer et Opera }
Pour pouvoir faire des tests sous windows, je possède:
• IExplorer 6
• NetScape 4.78
• NetScape 6
• Mozilla 1.3
• FireFox 0.9.3
• Opera 7.23

Si vous avez des remarques, je suis preneur, à+

Voici ce que j'obtiens actuellement:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
var agt=navigator.userAgent.toLowerCase();
var ns4=document.layers; 
if(document.all){
    if(agt.indexOf('opera')>-1) var opera=true;else var ie=true; }else
if(document.getElementById){
    if(agt.indexOf('netscape')>-1) var ns6=true;else 
    if(agt.indexOf('firefox')>-1) var ffx=true;else var moz=true; }
 
if(ns4){ 
    alert('NetScape 4.x');
}else if(opera){ 
    alert('Opera')
}else if(ie){
    alert('IExplorer')
}else if(ns6){  
    alert('NetScape 6');
}else if(ffx){  
    alert('FireFox');
}else if(moz){
    alert('Mozilla');
}else{
    alert('unknow');
}

Quelques liens intérressants:
http://www.mozilla.tlk.fr/doc05.php
http://www.quirksmode.org/js/dhtmloptions.html

Résolution de l'écran...

Code:

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
26
27
28
29
30
31
function resolution() {
 
nav = navigator.appName;
 
ah = screen.availHeight;
al = screen.availLeft;
at = screen.availTop;
aw = screen.availWidth;
cd = screen.colorDepth;
h  = screen.height;
pd = screen.pixelDepth;
w  = screen.width;
 
res = 'availHeight:\t' + ah + '\n';
 
if (nav == 'Netscape') {
	res = res + 'availLeft:\t' + al + '\n';
	res = res + 'availTop:\t' + at + '\n';
	}
 
res = res + 'availWidth:\t' + aw + '\n';
res = res + 'colorDepth:\t' + cd + '\n';
res = res + 'height:\t\t' + h + '\n';
 
if (nav == 'Netscape')
	res = res + 'pixelDepth:\t ' + pd + '\n';
 
res = res + 'width:\t\t' + w + '\n';
alert(res);
 
}

Faudrait voir maintenant avec quels OS et navigateurs cela ne fonctionne pas...
Hélas, je ne les ai pas tous (avec MAC par exemple).
Si vous pouviez m'aider ça serait super! ;)

05/09/2004, 13h40
Invité4

salut c vraiment sympa ton projet
Bravo!

Tu comptes le distribuer gratuitement une fois terminé ?
05/09/2004, 13h48
Sub0

Salut Eldacar!

Citation:

Envoyé par Eldacar

Tu comptes le distribuer gratuitement une fois terminé ?

Bien entendu, c'est l'objectif!
Surtout si vous participé à ce topic, ça m'encouragerais à progresser.

Je ne connais JS que depuis quelques mois seulement.
Je suis à la recherche de développeurs doués en JS qui pourront me conseiller et de "testeurs".
Je ne peux tester la lib que sous Win avec les navigateurs suivants:
• IExplorer 6
• NetScape 4.78
• NetScape 6
• Mozilla 1.3
• FireFox 0.9.3
• Opera 7.23

Merci d'avance pour votre participation! ;)
05/09/2004, 15h27
Invité4

Moi j'ai aussi un mac chez moi avec IE 5.5 et Netscape 4.5 sous mac os 9.1.
Je pourrai faire des tests au besoin
05/09/2004, 15h42
Sub0

Excelent!! :ccool:
Je te tiens au courant dès que j'ai des fonctions à tester!
En ce moment, je suis entrain de travailler sur les fonctions suivantes:
Résolution de l'écran, dimensions, positions de la fenêtre, de la page, d'un objet, etc...
Tout ce qui se rapporte au positionnement.

Merci beaucoups! ;)

http://www.mozilla.tlk.fr/doc03.php
15/05/2005, 16h11
Sub0

http://www.fastclemmy.com/index.php?viewlog=75_contourner-les-defauts-limitations-bugs-d-Internet-Explorer

http://www.aidejavascript.com/article82.html
16/05/2005, 22h57
agentzaizai

Et bien, il est clair que ton projet est vraiment un petit bijou si tu parviens à tes fins :D... car le javascript à l'heure actuelle, il est vraiment prise de tête ;)

Enfin bref, pour des tests, j'ai une suse 9.3 à ta disposition, et prés à installer n'importe quel navigateur qui te passe par la tête ;)
Actuellement, il y a opera 7.54, firefox , et konqueror dessus.

Bon courage ;)

Salut!
Je vais placer ici quelques liens intéressants pour le projet.
Si vous en connaissez des biens, n'hésitez pas à les poster...
En ce moment, je travaille essentiellement sur le positionnement et dimensionnement & évènements souris :

:arrow: Voici déjà une librairie de compatibilité Javascript trouvée sur le net :
http://www.devparadise.com/technoweb/code/jscript/a385.php
http://www.devparadise.com/technoweb/code/jscript/a305.php
http://download.devparadise.com/libv1.zip

Test n°1 : Il s'agit d'obtenir les coordonnées de la souris et de déplacer un div (genre info-bulle). La souris doit se trouver exactement dans le coin supérieur gauche du div. J'ai ajouté une table de 2000 x 2000 pixels en arrière-plan pour vérifier que les scrollbars n'altèrent pas le positionnement du div. Le redimensionnement et la position de la fenêtre ne devront pas interferer dans le fonctionnement de la démo :

Code:

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<html> 
 
<script type="text/javascript">
<!--
//============================================================ 
// Détermine le navigateur
//============================================================ 
var nsv=document.layers;
var iev=document.all;
if(!iev)var mov=document.getElementById;
var MouseX=0; 
var MouseY=0;
var ScrollX=0;
var ScrollY=0;
 
 
//============================================================ 
// Retourne la position des scrollbars
//============================================================ 
function GetScrollPos(){
  var curScrollX=ScrollX;
  var curScrollY=ScrollY;
  if(nsv){
    ScrollX=window.pageXOffset;
    ScrollY=window.pageYOffset;
  }else{
    if(document.documentElement.scrollLeft)
      ScrollX=document.documentElement.scrollLeft;
    else ScrollX=document.body.scrollLeft;
    if(document.documentElement.scrollTop)
      ScrollY=document.documentElement.scrollTop;
    else ScrollY=document.body.scrollTop;
  }
  if(curScrollX!=ScrollX||curScrollY!=ScrollY) NewScrollPos();
}
 
 
//============================================================ 
// Retourne la position de la souris
//============================================================ 
function GetMousePos(e){
  var curMouseX=MouseX;
  var curMouseY=MouseY;
  if(nsv){
    MouseX=e.pageX-2-ScrollX;
    MouseY=e.pageY-2-ScrollY;
  }else if(mov){
    MouseX=e.clientX;
    MouseY=e.clientY;
  }else{ 
    MouseX=window.event.x;
    MouseY=window.event.y;
    if((navigator.userAgent).indexOf('Opera',0)<0){ 
      MouseX=MouseX-2; 
      MouseY=MouseY-2;
    }
  }
  if(curMouseX!=MouseX||curMouseY!=MouseY) NewMousePos();
}
 
 
//============================================================ 
// Appellée par une nouvelle position des scrollbars
//============================================================ 
function NewScrollPos(){ ReplaceDiv(); }
 
 
//============================================================ 
// Appellée par une nouvelle position de la souris
//============================================================ 
function NewMousePos(){ ReplaceDiv(); }
 
 
//============================================================ 
// Réactualise la position du div
//============================================================ 
function ReplaceDiv(){
  if(nsv){ 
    document.divbulle.left=ScrollX+MouseX;   
    document.divbulle.top=ScrollY+MouseY;
  }else{ 
    document.getElementById('divbulle').style.left=ScrollX+MouseX;        
    document.getElementById('divbulle').style.top=ScrollY+MouseY;
  }
}
 
//============================================================ 
// Initialisation 
//============================================================ 
if(nsv) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=GetMousePos;
setInterval('GetScrollPos()',1);
 
 
 
//============================================================ 
//-->
</script>
 
 
<body>
 
<table border="0" style="background:silver;">
<tr><td width="2000" height="2000"><p>&nbsp;</td></tr>
</table>
 
<div id="divbulle" style="position:absolute;left:0;top:0;">
  <table border="0" style="background:red;">
  <tr><td width="50" height="50"><p>&nbsp;</td></tr>
  </table>
</div>
 
</body>
</html>

J'ai déjà testé ce code sous win xp avec IE6, Opera 7.23, Mozilla 1.3, Netscape 4.78...
Tous les tests avec d'autres OS et navigateurs m'intéressent !!

http://sub0.developpez.com/merci.png pour votre participation.

12/07/2005, 00h29
Sub0

Selon vous, Netscape 4.78 est-il un navigateur obsolète ? :koi:
Est-ce qu'en prévoyant l'intégration de ce navigateur, on assure pas davantage la compatibilité des fonctions ?
...son intégration demande beaucoups de travail... :(
12/07/2005, 00h37
ovh

Citation:

Envoyé par Sub0

Selon vous, Netscape 4.78 est-il un navigateur obsolète ? :koi:

Totalement ;)

D'après les stats de mon site du boulot, il représente moins de 0.5% !!!! (0.3% pour être précis)

Les 4 premiers sont :
IE : 77.8%
Firefox : 17.2%
Mozilla : 1.8%
Opera : 1.2%
tout le reste représente moins de 1%...

Et encore il s'agit d'un site d'informatique, donc il y a un certain nombre de connaisseurs qui le visitent ce qui explique le taux "important" des navigateurs alternatifs à IE...
12/07/2005, 08h37
SpaceFrog

Sub0,

Tout d'abord je tiens à te féliciter et t'encourager dans cette heureuse initiative.
J'avoue avoir tendance à calquer mon degré d'intérêt de la compatibilité de mes sites sur les pourcentages statistiques des utilisation de browser :oops:
Je me contente en général d'instructions basiques reconnues par la majorité des navigateurs et finis souvent par obtenir de codes allambiqués...
J'ai d'ailleurs tout récemment modifié un code de saisie de date sur la base d'un calendrier en convertissant les dates en string de façon à pouvoir les comparer quelque soit le browser et l'OS... (Je le paufine et je le mettrait dans les codes source)
Je ne suis pas partisan des codes à rallonges avec des if (nav=="IE") mais de plus en plus avec les palms et autre supports il va falloir sniffer correctement les browsers et agir en conséquence j'ai d'ailleurs récupérer quelques sniffers intéressants que je mettrais ici ...

Bref une bibli de code transbrowser sera vraiment top, a mon gout ne pas y trouver de tonne de if ou de case serait l'idéal ...

Oui je sais c'est beau l'utopie ...

Meci pour cette magnifique contribution Sub0
12/07/2005, 11h03
ovh

Puisqu'on en est à philosopher sur le javascript j'y vais de mon grain de sel :P

Perso je ne l'utilise que le strict minimum, juste pour afficher un popup quand j'en ai vraiment besoin, ou amener le focus sur un champ d'un formulaire, c'est tout. Et ce genre de code marche pour tous les browsers (si on met la hierarchie complète d'objets et non des "raccourcis" comme IE permet de faire).

Javascript pouvant être désactivé, les codes de validation de données de formulaire devraient se faire exclusivement sur le serveur, pour moi ça ne sert pas à grand chose de le faire côté client. De plus, c'est parfois plus pratique côté serveur si tu dois vérifier la cohérence d'un champ par rapport à une BD.

Merci à vous pour votre soutien et vos encouragements. :ccool:

Ok, mettons NS4.78 aux oubliettes... définitivement !
Cependant je tiens à ce que le visiteur qui utilise un navigateur non compatible avec la lib soit averti (pour être redirigé par exemple). Je pense dresser la liste des configs compatibles réellement testées. C'est pour cette raison que j'ai commencé ce projet par une fonction pour récupérer l'OS, le nom et la version du navigateur, sans oublier la version de Javascript :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16  <script language="JavaScript">var v=1.0,lang='JavaScript';</script> <script language="JavaScript1.1">v=1.1;</script> <script language="JavaScript1.2">v=1.2;</script> <script language="JavaScript1.3">v=1.3;</script> <script language="JavaScript1.4">v=1.4;</script> <script language="JavaScript1.5">v=1.5;</script> <script language="JavaScript1.6">v=1.6;</script> <script language="JScript"> var v2=v;if(typeof ScriptEngine=="undefined"){ lang='JScript';v=1; }else{ lang=ScriptEngine(); v=[ScriptEngineMajorVersion(),ScriptEngineMinorVersion(),ScriptEngineBuildVersion()]; v=v.join('.'); }</script> <script language="JavaScript">jstext1=lang+' version '+v;</script> <script language="JScript">jstext2='JavaScript version '+v2;</script> <noscript><p>Javascript introuvable...</noscript>
Comme vous pouvez le constater, je ne cherche pas qu'à réaliser une lib super simple qui rendra nos développement plus faciles, mais surtout à rassembler le maximum de fonctions systèmes et les valider en les testant avec toutes les configs disponibles... A terme, l'objectif est que cette lib puisse répertorier et fournir des fonctions de haut niveau très sûres, lesquelles nous permettront le développement d'autres librairies plus spécifiques et totalement compatibles (date, math, formulaire, images, etc...). J'espère que mon idée vous séduira et que vous aurez le temps de participer à la réalisation de ce "grand" projet.

Merci. ;)

13/07/2005, 21h01
Sub0

Salut! ;)

:idea: Je songeait à une astuce pour valider les configs. En cas d'erreurs (exceptions), demander à l'utilisateur d'accepter de poster un tout petit formulaire (genre rapport d'erreur). J'enregistrerai alors dans une base de données, les infos sur leur configuration et les erreurs... On peut éventuellement imaginer un check de toutes les fonctions dans cette procédure... On peut également proposer une mise à jour de la liste des config validées si un utilisateur en possède une... Qu'en pensez-vous ?

Autre chose, selon vous, quelles sont les versions de Javascript les plus utilisées et quelles sont les versions obsolètes ?
Devra-t-on tenir compte de chaque version pour valider une config ?
05/12/2005, 14h53
le Daoud

Salut,

Je me demandais s'il ne serait pas intéressant de créer des classes pour les différents navigateurs possibles. Tu identifies au départ le navigateur et tu instancie un objet correspondant qui contient les méthodes de ce type de navigateur.
Certes il n'est pas possible (tout du moins à ma connaissance) de faire réellement du polymorphisme, mais cela peut déjà simplifier la tâche.
05/12/2005, 20h23
pierre chevignard

Bonjour le Daoud,

Oui, tu as sûrement raison. Mais il y a tellement de choses que j'ignore encore que les notions de classe et d'instance ne font que m'évoquer quelque chose. Je suis bien incapable de les mettre en oeuvre.

Est-ce à dire que pour chaque navigateur, on enregistrerait les routines utiles et qu'il suffirait de les appeler le moment venu ?

Merci de m'y aider.

Pierre.

Idée :

je reprends le script de sub0 que je modifie

Code:

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
26
27
28
 
function getNavigateur(){
 var agt=navigator.userAgent.toLowerCase();
 var ns4=document.layers;
 var nav = null;
 if(document.all){
     if(agt.indexOf('opera')>-1) var opera=true;else var ie=true; }else
 if(document.getElementById){
     if(agt.indexOf('netscape')>-1) var ns6=true;else
     if(agt.indexOf('firefox')>-1) var ffx=true;else var moz=true; }
 
 if(ns4){
     nav = new Ns4();
 }else if(opera){
     nav = new Opera();
 }else if(ie){
     nav = new Iexplorer();
 }else if(ns6){ 
     nav = new Netccape();
 }else if(ffx){ 
     nav = new FireFox();
 }else if(moz){
     nav = new Mozilla();
 }else{
     alert('unknow');
 }
return nav;
}

Dans chaque classe on implémente les méthodes selon les spécificités
Ex avec un bout de code pour le navigateur ns4 (je prends un bout de Sub0 encore)

Code:

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
26
27
28
29
30
31
32
 
//constructeur
function Ns4(){
  this.nom = "NS4";
  this.resolution = resolution;
  //etc...
}
 
function resolution() {
 ah = screen.availHeight;
 al = screen.availLeft;
 at = screen.availTop;
 aw = screen.availWidth;
 cd = screen.colorDepth;
 h  = screen.height;
 pd = screen.pixelDepth;
 w  = screen.width;
 
 res = 'availHeight:\t' + ah + '\n';
 res = res + 'availLeft:\t' + al + '\n';
 res = res + 'availTop:\t' + at + '\n';
 
 res = res + 'availWidth:\t' + aw + '\n';
 res = res + 'colorDepth:\t' + cd + '\n';
 res = res + 'height:\t\t' + h + '\n';
 
 res = res + 'pixelDepth:\t ' + pd + '\n';
 
 res = res + 'width:\t\t' + w + '\n';
 return res;
 
}

Ainsi, chaque navigateur possède cette fonction résolution ce qui permet de faire :

Code:

1
2
3
 
var nav  = getNavigateur();
alert(nav.getResolution());

Il faudrait même créer une classe mère "Navigateur" qui incorporerait toutes les méthodes communes (ensuite l'héritage se fait avec this.parent)
Bon, j'espère ne pas dire trop de bêtises ;)

bonjour,

j'éprouve toujours quelques reserves à me baser sur le navigator.userAgent pour identifier le navigateur.
Meme si IE ne permet pas de changer nativement cette string, je suppose qu'il doit bien y avoir un dérivé qui le permette (AvantBrowser, etc ... ?), voir via un plug-in ou quelque chose du genre.
Pour les autres navigateurs il est encore plus aisé de la changer.

Il me semble également que Opera ne s'identifie que depuis peut sous ce nom dans sa string userAgent.

L'idée serait plutot de tester des propriétés valides seulement pour un navigateur (ou famille de navigateurs).
Par exemple pour identifier opera il existe un window.opera, qui tombera plus juste qu'un userAgent.
Attention ! window.opera doit etre testé avec un window.opera && true, ou quelque chose de semblant, sinon cela peut ne pas fonctionner.

On peut retrouver ici http://www.howtocreate.co.uk/tutoria...s/sniffer.html les tests complets sur cette methode qui permet de construire un getNavigator().
Je ne met pas à jour la fonction n'ayant pas encore lu les termes d'utilisation (même si je ne crois pas que ces termes ce rapportent à ces tests, mais au cas où ...).

Sinon sans utiliser tout ces tests, avant d'avoir vu la page que je viens de donner, et même encore aujourd'hui n'ayant pas besoin de tous les identifier, j'utilisais les tests suivant :
Code:

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 26 27 28 29 30 31 32 33 34 (navigator.vendor == 'KDE') { // Les tests suivant provoquent une erreur chez Konqueror, il faut absolument le tester en premier ! ... } else // internet explorer windows if(window.external) { ... } else // internet explorer mac if (document.all && (navigator.userAgent.indexOf('Win') < 0)) { ... } else //Opera if (window.opera && window.print) { ... } else // netscape 6.x if (window.sidebar) { ... } else // netscape 4.x if (document.layers) { ... } else { ... }
Et seconde remarque :
J'ai quelques problemes d'execution sur certains vieux navigateurs si mon fichier JS est encodé en UTF-8, normalement ma page l'est également.
Si mes souvenirs sont bons, c'est avec IE 3, je crois que la version 4 également (oui mais là si on utilise encore ça ...), et Nestcape 4.
Il faudrait que je reteste ça un jour pour vraiment savoir quels navigateurs pose problème ...

Voilà, en esperant que cela poura aider :D

Salut! ;)

Voici le code que j'utilise pour obtenir la position de la souris avec Javascript.
Il doit sûrement avoir moyen d'optimiser le code... Il fonctionne avec tous mes navigateurs :

Code:

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
var iev=document.all;
if(!iev)var mov=document.getElementById;
if(!mov&&!iev)alert("Application incompatible avec votre navigateur!");
 
var PosX,PosY;
 
//============================================================================//
// Supprime le "px" en fin de chaîne -> nombre
//============================================================================//
function nbr(nombrepx){
	if(nombrepx){
		if(nombrepx.length>=3)
			if(nombrepx.substr(nombrepx.length-2,2)=="px")
				return (nombrepx.substr(0,nombrepx.length-2))*1;
		return nombrepx*1;}
	return 0*1;
}
 
//============================================================================//
// Retourne la valeur du scroll
//============================================================================//
function GetScrollX(){
	if(mov)return nbr(document.body.scrollLeft); 
	if(document.documentElement.scrollLeft)
		return nbr(document.documentElement.scrollLeft);else 
		return nbr(document.body.scrollLeft); 
}
 
//============================================================================//
function GetScrollY(){
	if(mov)return nbr(document.body.scrollTop);
	if(document.documentElement.scrollTop)
		return nbr(document.documentElement.scrollTop);else 
		return nbr(document.body.scrollTop); 
}
 
 
//============================================================================//
// Détection des coordonnées de la souris
//============================================================================//
function MyMousePosX(evenement){
	if(mov)return nbr(evenement.clientX)+GetScrollX();
	return nbr(window.event.x)+GetScrollX()-2;
}
 
//============================================================================//
function MyMousePosY(evenement){
	if(mov)return nbr(evenement.clientY)+GetScrollY();
	return nbr(window.event.y)+GetScrollY()-2;
}
 
 
//============================================================================//
// Souris en mouvement
//============================================================================//
function Position(evenement){
	PosX=nbr(MyMousePosX(evenement))-
   nbr(document.getElementById("mytab").left)-
   nbr(document.getElementById("mydiv").left);
	PosY=nbr(MyMousePosY(evenement))-
   nbr(document.getElementById("mytab").top)-
   nbr(document.getElementById("mydiv").top);
	if(PosX>=0 && PosX<=nbr(document.getElementById("mydiv").offsetWidth)&&
	   PosY>=0 && PosY<=nbr(document.getElementById("mydiv").offsetHeight)){		
	  document.getElementById("mydiv").style.backgroundColor=col2;	
    }else{
	  document.getElementById("mydiv").style.backgroundColor=col1;	
		}
}
 
//============================================================================//
// INITIALISATION
//============================================================================//
document.onmousemove = Position;

à+

15/08/2008, 18h47
Sub0

Salut! ;)

Encore une adresse intéressante trouvée par hasard...