Discussion :

[Maveck]

Bonjour

J'ai deux boites div de tailles différentes qui sont côte à côte.

Ces deux boites div on des contenus différents et de taille différentes.

Exemple : le div de gauche (divfilms) contient une liste de films(divfilm). Chaque div film contient une liste d'acteurs(divacteur). le div de droite (divrepliques) contient une liste de répliques(divreplique), soit les répliques de tout le film, soit les répliques d'un seul des acteurs.

Est-il possible de trouver la position d'un élément contenu dans une des deux boites div afin de synchroniser au niveau du défilement la position des div.

En gros, peut on faire en sorte que quand on est dans un film et qu'on déroule la liste des acteurs, on ait la liste des répliques qui reste en face de chaque acteur...

Peut-on obtenir l'id de l'élément que l'on voit en premier dans le div pendant un scroll ?

Peut-on obtenir l'id des éléments visibles lors d'un scroll?

N'y a-t-il que ces propriétés d'un div ayant un rapport avec le scroll ?
scrollLeft
scrollTop
scrollWidth
scrollHeight

Sinon, je peux faire un rapport avec scrollHeight et scrollTop, mais j'aimerais savoir tout de même si c'est possible d'obtenir la position d'un élément dans un scroll, si il est visible ou non etc...


Merci d'avance à tous

Ps : j'ai utilisée la fonction recherche qui est mon amie

[SpaceFrog]

soit tu as des cartouches de même taille contenant les infos et là tu mets le scrollTop du div sur l'élément concerné,
soit tu as une relation proposrtionnelle entre les deux scrollTop et tu appliques le coeff sur le scroll du premier div ...

[Maveck]

Les éléménts des deux div n'ont pas de rapport de proportion.

Je ne comprends pas ta première solution :

On peut positionner le scroll sur un sous élément du div ? Les sous éléments du div de gauche par exemple ont tous la même taille, mais les sous éléments de droite...

[SpaceFrog]

sert toi des ancres ...

par exemple :

Code :

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

1
2
3
4
5
 
	function ShowAddress(Ancre) {
document.getElementById('container').scrollTop=document.getElementById('_'+Ancre).offsetTop;
		return true;
		}

je me sers de ce bout de code pour afficher une adresse dans un div à partir d'un onmouseover sur une area ...

a toi de definir lévènement qui doit déclencher l'affichage

[Maveck]

Merci, c'est le offsetTop que je ne connaissais pas....

Je vais regarder ça.

Pour l'instant j'ai fait un truc avec les proportions, ça fonctionne, mais que sur l'une des deux scrollbars. Si je fais les deux, ça remonte tout seul (c'est très joli au passage)

[Maveck]

Je ne parviens pas à mettre tel ou tel élément face à un élément de l'autre liste.

Du coup j'ai utilisé :

Code :

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

1
2
3
4
5
6
7
8
9
10
 
function synchro(s,t){
   	var ttop = t.scrollTop;
   	var stop = s.scrollTop;
   	var theight = t.scrollHeight;
   	var sheight = s.scrollHeight;
   	var taillelistefilms = 448;
	var taillerepliques = 430;
	t.scrollTop = ( theight - taillelistefilms ) / ( ( sheight - taillerepliques ) / stop );
}

Maintenant je cherche un moyen de récupérer dynamiquement la hauteur de taille liste films et taille repliques, car je trouve ça "crade" et pas pratique d'aller bricoler le js à chaque fois que je veux changer le css....

[Maveck]

Code :

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

1
2
 
document.getElementById("id_de_l_element").offestHeight;

me donne la valeur de la hauteur de la boite.

Impeccable donc.

Merci