offsetLeft sous Firefox

**simoryl** · 05/03/2008, 16h03

Salut,

Voilà, je cherche à positionner un layer par rapport à une image qui se trouve à une position fixe dans ma page.
Sous IE, le code marche nickel mais sous Firefox, c'est total à l'ouest : plus j'élargis ma fenêtre et plus mon layer se décale sur la droite (left>1000 au lieu de 200) au lieu de rester au coin de mon image... J'ai cherché un peu partout une solution mais tout le monde semble faire la même chose...

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
 
obj=document.getElementById('ImagePortrait');
		if (obj.parentNode) {
			curleft = parseInt(obj.offsetLeft);
			curtop = parseInt(obj.offsetTop);
			while (obj = obj.parentNode) {
				if(!isNaN(obj.offsetLeft)) {
					curleft+=parseInt(obj.offsetLeft);
				}
				if(!isNaN(obj.offsetTop)) {
					curtop += parseInt(obj.offsetTop);
				}
			}
		}
document.getElementById('LPortrait').style.top=curtop+'px';
document.getElementById('LPortrait').style.left=curleft+'px';

Je pige pas trop là, je suis plutôt habitué aux bizarrerie sous IE lol...

Merci pour vos idées

Simo'

**le_chomeur** · 06/03/2008, 09h27

Salut aurais tu l'exemple complet ou en ligne ?

**simoryl** · 06/03/2008, 13h42

c'est pour le moment en local, il est pas disponible en ligne. Sinon, l'exemple est complet. Il manque juste le début de la fonction et l'accolade de fin.
Cette fonction est appelée via un setInterval toutes les secondes pour parer le redimensionnement de la fenêtre.
Je peux eventuellement mettre le code html complet de la page mais y a rien de spécial c'est ça le pire...

**le_chomeur** · 06/03/2008, 17h53

heu oui je veux bien car hors contexte , ce n'est pas très parlant

**simoryl** · 06/03/2008, 18h19

ok, voici un code épuré de tout ce qui sert à rien.
Le problème est toujours présent.

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
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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
<style type="text/css">
html, body {
	margin: 0px;
	padding: 0px;
	height:100%;
}
body, td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}
.wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -10px;
}
.footer, .push {
	height: 10px;
	font:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#999999;
}
#LPortrait1 {
	position:absolute;
	left:427px;
	top:230px;
	width:250px;
	height:12px;
	z-index:1;
}
</style>
</head>
<body>
<div class="wrapper" style="height: 100%;">
<div style="top: 496px; left: 439px;" id="LPortrait1"><a href="#" id="TPortrait1">Texte</a></div>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
  <tr>
    <td>
	&nbsp;
	</td>
  </tr>
  <tr>
    <td>
	<table align="center" border="0" cellpadding="0" cellspacing="0" width="1000">
  <tr>
    <td valign="top" width="600">
    <img src="" id="positionner" height="364" width="571"><br>
    <br></td>
	<td align="center" valign="top" width="360">&nbsp;</td>
  </tr>
</table>
	</td>
  </tr>
</table>
<br>
<div class="push"></div>
</div>
<div class="footer" align="center">Tous droits réservés</div>
<script language="Javascript">
		function placeLayerPortrait() {
		obj=document.getElementById('positionner');
		if (obj.parentNode) {
			curleft = parseInt(obj.offsetLeft);
			curtop = parseInt(obj.offsetTop);
			while (obj = obj.parentNode) {
				if(!isNaN(obj.offsetLeft)) {
					curleft+=parseInt(obj.offsetLeft);
				}
				if(!isNaN(obj.offsetTop)) {
					curtop += parseInt(obj.offsetTop);
				}
			}
		}
		document.getElementById('LPortrait1').style.top=(curtop+230)+'px';
		document.getElementById('LPortrait1').style.left=(curleft+427)+'px';
		}
		setInterval('placeLayerPortrait()',10);
</script>
</body>
</html>

**simoryl** · 10/03/2008, 15h01

le we m'a fait du bien lol...

En fait sous firefox, le tr et tbody ont la même valeur que mon td pour le offsetleft et du coup mon td était compté "3 fois". Du coup, suffit de filtrer sur le type de balise pour ne pas les comptabiliser et voili voilou

Simo'

offsetLeft sous Firefox

JavaScript

Discussions similaires

Partager

Partager