Discussion :

[keaton7]

Bonjour,

J'ai un événement AJAX qui met a jour une div, et j'aimerai que le scroll soit directement en bas, puisque le contenu est suffisamment conséquent pour que ça nécessite un ascenseur.

Le code suivant ne fonctionne pas pour le scroll, auriez vous une solution miracle ? Prototype sait gérer le scroll nativement ?

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
function monAction() { 
  var myAjax = new Ajax.Updater(
    "ma_div",
    "mon_fichier.php",
    { 
    method: "post",
    parameters: 
      { 
      param1: "a" , 
      param2 : b
      } , 
    onComplete : function() 
      { 
      descendreAscenceur() 
      } 
    } 
  ); 
}
 
function descendreAscenceur() { 
  $('ma_div').scrollTop=$('ma_div').scrollHeight; 
}

[gwyohm]

Prototype sait gérer le scroll nativement ?

Oui, tu peux demander à scroller jusqu'à un élément :

Code :

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

1
2
3
4
 
function descendreAscenceur() { 
  $('ma_div').scrollTo();
}

http://prototypejs.org/api/element/scrollto

[keaton7]

Mais ca ne me permet pas de scroller tout en bas de ma div ?

[keaton7]

Apres essais, je teste désespérément le code suivant sans succès :

Ma div principale a une propriete css overflow:auto.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<a href="javascript:void(0)" onClick="$('principale').scrollTo('bottom');">Descendre le sroll</a>
 
<div id="principale">
 
  <div id="contenu">
    ...
  </div>
 
  <a name="bottom"></a>
 
</div>

[gwyohm]

OK, je n'avais pas compris que tu scrollais dans une div...

Donc si tu veux descendre en bas de ta div en overflow auto :

Code :

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

1
2
 
$("principale").scrollTop = $("contenu").getHeight() - $("principale").getHeight();

tu n'as donc pas besoin du <a name="bottom">, il faut simplement que ta div contenu contienne tout le contenu.

Si tu veux passer par une ancre (par exemple si tu as plusieurs endroits possibles où t'arreter,

Code :

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

$("principale").scrollTop= $$("a[name=bottom]").first().positionedOffset().top - $("principale").getHeight();

[keaton7]

Super ca fonctionne, merci beaucoup .