Résultat different pour les proprietés top et left entre ie et firefox

**kodo** · 27/01/2010, 01h44

Salut tout le monde.
je cherche une solution pour obtenir le même résultat sur IE et Firefox concernant les les propriétés de style top et left.
d'après l'exemple ci dessous, firefox ne reconnait pas top et left.

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test doc</title>
<script>
	function change(){
	  var div0 = document.getElementById("div0");
	  var div1 = document.getElementById("div1");
	  alert(div0.style.top);
	  div0.style.left = div1.offsetLeft + document.body.scrollLeft;
	  div0.style.top = div1.offsetTop + document.body.scrollTop;
	  div0.style.width = div1.offsetWidth;
	  div0.style.height = div1.offsetHeight;
	  alert(div0.style.top);
	}
</script> 
</head>
 
<body>
	<div id="div1" style="width: 300px; border-color:blue;
	  border-style:solid; border-width:1;">
	  ***** DIV 1 ******
	</div>
 
	<div id="div0" style="position: absolute; border-color: red;
	  border-width: 1; border-style: solid; z-index: 10">
	  ***** DIV 0 ******
	</div>
	<br /><br />
	<input type="button" value="test" onclick="change()" />
</body>
</html>

avez une idée ,une solution ou une autre façon de faire pour ce problème ?
Et merci infiniment.

**vermine** · 27/01/2010, 07h47

Bonjour,

A première vue, je me demande si les espaces après les ":" ne font pas planter le bazare, et le fait que div1 ne soit pas en position absolute.

Ou tout simplement le fait qu'il faut préciser l'unité comme ici:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
border-width:1px;

**SpaceFrog** · 27/01/2010, 08h25

fais une recherche sur

avec "css boxtype"

**le_chomeur** · 27/01/2010, 10h02

Comme souligné par vermine, pour qu'un élément soit positionné via top et left il faut que son positionnement soit en absolute ou fixed

**kodo** · 27/01/2010, 23h49

Salut les amis j'ai trouvé ce qui manque dans mon code pour qu'il marche bien sous firefox, c'est tout simplement les 'px'

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 div0.style.left = div1.offsetLeft + document.body.scrollLeft + 'px';
	  div0.style.top = div1.offsetTop + document.body.scrollTop + 'px';
	  div0.style.width = div1.offsetWidth + 'px';
	  div0.style.height = div1.offsetHeight + 'px';

Merci beaucoup pour vs réponses.

**SpaceFrog** · 28/01/2010, 08h32

le truc bateau auquel on ne pense plus lorsque l'on code systématiquement en indiquant les unités ...

Résultat different pour les proprietés top et left entre ie et firefox

JavaScript

Vue hybride

Discussions similaires

Partager

Partager