Write OffsetTop avec un div en variable

**Pazticci** · 27/01/2009, 00h26

Bonsoir à tous,

je suis sur un petit projet et je bloque. Je suis débutant en javascript alors ma question va peut-être être stupide pour certain mais pour mois je bloque et cela m'empêche d'avancer ....

en fait j'ai dans un page plusieurs div que je nomme par l'id respectivement id1, id2 etc ... le but étant d'en avoir pleins tout pleins.

J'ai trouvé une petit fonction que me permet de retrouver les valeurs de chaque id et de les afficher en boucle.
Hors moi je souhaiterai en plus d'afficher leur id, je voudrais que pour chaque div s'affiche le Top et le Left par rapport à la page.

Exemple d'affichage du résultat:

Id1 Top= 100px
Left = 500 px
id2 Top=300px
Left= 50 px

etc ....

Hors avec ma "requete" j'obtiens bien les noms des div mais j'obtiens aussi un 0 à la place des valeurs Top et Left.

Voici mon code :

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
 
<html>
<head>
<script type="text/javascript">
function affichage()
 
{
var tab_div=document.body.getElementsByTagName('div');
 
for (i=0;i<7;i++){
 
document.write("ligne numéro "+tab_div[i].id+"<br />");
document.write(tab_div[i].offsetTop);
document.write("<br />");
document.write(tab_div[i].offsetLeft);
document.write("<br />");
}  
 }
 
 
 
</script>
</head>
 
 
<body>
<div id="id1" name="prout" style="position:absolute;left:100px;top:100px;">ESSAI</div>
<div id="id2" name="qui pue" style="position:absolute;left:200px;top:600px;border-width:1px;border-color:lightblue;border-style:solid;width:250px;background-color:#cccccc;"></div>
 
<div id="id3" name="prout" style="position:absolute;left:150px;top:100px;">ESSAI3</div>
<div id="id4" name="prout" style="position:absolute;left: 350px;top:340px;">ESSAI4</div>
<div id="id5" name="prout" style="position:absolute;left:400px;top:120px;">ESSAI5</div>
<div id="id5" name="prout" style="position:absolute;left:450px;top:360px;">ESSAI6grhtjykiuj</div>
 
<input type="button" value="Enregistrer les changements" onclick="affichage();"> 
</div>
</body>
</html>

Quelqu'un peut-il m'aider et me dire pourquoi j'obtiens ceci :

ligne numéro id1
0
0
ligne numéro id2
0
0
ligne numéro id3
0
0
ligne numéro id4
0
0
ligne numéro id5
0
0
ligne numéro id5
0
0

Merci pour votre aide, vos conseils et votre indulgence cr je suis débutant mais tout aide, réponse ou orientation sera la bienvenu. Je galère vraiment sur ce petit truc même si je suis persuader que cela n'est pas quelque chose de bien compliqué.

Merci pour votre aide

PAz

**marcha** · 27/01/2009, 08h28

Salut,

En utilisant document.write après que ta page a été rendue, tu
provoque l'ouverture d'un nouveau document. Si bien que les
div que tu cherche à observer ne sont plus présents.

Essaie ceci:

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
 
function affichage() {
	var tab_div=document.body.getElementsByTagName('div');
	var html = '';
	for (var i=0;i<tab_div.length;i++) {
		html += "ligne numéro "+tab_div[i].id+"<br />";
		html += tab_div[i].offsetTop;
		html += "<br />";
		html += tab_div[i].offsetLeft;
		html += "<br />";
	}  
	var e = document.createElement('div');
	document.body.appendChild(e);
	e.innerHTML = html;
}

**Pazticci** · 27/01/2009, 10h50

Un grand merci à toi marcha, c'est exactement ce que je voulais faire mais je n'y arrivait désespérément pas ... j'ai bien compris le code. Mille merci encore à toi.

PAz

Write OffsetTop avec un div en variable

JavaScript

Discussions similaires

Partager

Partager