[DOM] Positionner la scrollbar d'un div en fonction d'un element
Bonjour,
Je chercher à positionner la scrollbar d'un div pour qu'un element de celui-ci soit visible (centré serait le mieux).
Code du div :
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
|
<div style="height:200px; overflow:auto" id="grandDiv">
<div id="truc10">
<div id="sousTruc11">
</div>
<div id="sousTruc12">
</div>
</div>
<div id="truc20">
<div id="sousTruc21">
</div>
<div id="sousTruc22">
</div>
</div>
<div id="truc30">
</div>
<div id="truc40">
</div>
</div> |
Par exemple, ici, disons que le div "sousTruc22" n'est pas visible directement, il faut utiliser la scrollbar pour y accèder.
Le script que je cherche à faire serait d'utiliser la propriété scrollTop du div "grandDiv" de façon à ce que "sousTruc22" soit visible.
Je suis arrivé à faire quelque chose qui fonctionne des fois, mais cela ne marche que sous IE...
Ce code positionne la scrollbar de façon à ce que l'élément soit sur la première ligne.
Code:
1
2
3
4
5
6
7
8
9
10
| var obj = document.getElementById("sousTruc22");
var monOffsetTop = obj.offsetTop;
while (obj.parentNode.id != "grandDiv") {
obj = obj.parentNode;
monOffsetTop = monOffsetTop + obj.offsetTop;
}
var objGrandDiv = document.getElementById("grandDiv");
objGrandDiv.scrollTop = monOffsetTop; |
Firefox renvoi le offsetTop relativement au document, si j'ai bien compris, alors que IE par rapport au noeud père...
De plus des fois (par exemple au premier lancement de ce script), IE ne renvoi pas une valeur correcte, par contre ca marche à la deuxième execution...
Je n'ai pas compris pourquoi...
Pensez-vous que ceci peut être réalisable facilement
Pouvez vous m'aider à résoudre ce problème ?
Merci
Fabs
