Lancer évènement sur le scroll.

Version imprimable

07/04/2008, 11h41
madevilts

Lancer évènement sur le scroll.

Salut à tous !

J'ai un tableau html chargé en Ajax qui me permet de voir un certain nombre d'enregistrement. J'aimerai pouvoir compléter cette liste lorsque je descends à la fin de celle ci.
Exemple, j'affiche 50 enregistrements, quand je scroll et que j'arrive au bas du tableau ou un peu avant, hop je charge, 50 de plus.

Est ce possible ou bien je garde ma gestion par page ?
07/04/2008, 12h05
SpaceFrog

ben onscroll ?
teste le scrollTop ...
07/04/2008, 14h11
madevilts

onscroll ? :oops: je savais pas que l'évènement existait. Je test et je te dis quoi ;)
07/04/2008, 14h39
madevilts

L'évènement Ok :) merci !

Pour le scrollTop, cette propriété n'est pas valable pour toutes les balises ?
07/04/2008, 14h47
SpaceFrog

ton tableau est dans un div ?
à priori partout ou je l'ai utilisé il passe ...
07/04/2008, 14h57
madevilts
Ok. Je viens tester sur le body, c'est niquel.

Par contre quand je le mets sur une balise que l'on ne voit pas à l'ouverture de la page, ça m'affiche toujours zéro.

Voici le javascript :
Code:

1 2 3 4 5 function controle_scroll() { var objet = document.getElementById('flagscroll'); alert(objet.innerHTML+' > '+objet.scrollTop); }
Sur ma balise body

Code:

<body onscroll="controle_scroll();">

Code:

<span id="flagscroll">tada</span>

Et quand je scroll ça m'affiche

Code:

tada > 0

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
25
26
27
28
<input id="foo" type='text' />
<div onscroll="document.getElementById('foo').value=this.scrollTop;" style="overflow:auto; height:40px; width:100px;">
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
</div>

focntionnera avec un span si tu le mets en diplay: block :

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
25
26
27
28
<input id="foo" type='text' />
<span onscroll="document.getElementById('foo').value=this.scrollTop;" style="overflow:auto; height:40px; width:100px; display:block">
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
kjh<br />
</span>

07/04/2008, 15h28
madevilts

Ok en fait, je n'avais pas compris l'utilisation de scrollTop. je croyais que ça donnait le Y d'une balise alors que ça retourne le Y du scroll à l'intérieur de la balise.

Pour ma part, c'est toute la page qui scroll donc je dois le faire sur le body et le comparer avec ma balise flag pour savoir la distance entre le flag et le bas de ma fenetre.