Machen Sie einen rollbaren Element Aufenthalt „am unteren Rand“, während das Hinzufügen von Inhalten

Question

Ich baue eine Utility-Seite für eine Web-Anwendung, die ich arbeite. Ich habe ein Element, das ich als „Konsole“ von Sorten verwendet werden soll.

Ich bekomme Einträge für die Konsole über Ajax Anrufe (Prototyp Ajax.PeriodicalUpdater verwendet wird).

Das Problem, das ich habe, ist, dass, wenn ich neue Zeilen am Ende der „Konsole“ einzufügen, die Scrollbar in der Ausgangsstellung bleibt (so habe ich immer die Top-Linien sehen, wenn ich nach unten scrollen manuell).

Wie kann ich die Scrollbar automatisch am unteren Rand bleiben?

Ich benutze Prototyp für ein paar Bibliotheken, die es in diesem Projekt benötigen, also würde ich mit dem oder regelmäßigem javascript wenn möglich zu halten bevorzugen.

Nur als Anmerkung, ich habe bereits versucht, diese:

onComplete: function() { 
    $('console').scrollTop = $('console').scrollHeight;
}

Es fast arbeitet, mit der Ausnahme, dass es immer „ein Schritt hinter“, und ich kann den jüngsten Artikel ist nicht sehen.

Answer 1

new Ajax.PeriodicalUpdater(container, url, {
    onComplete: function() {
        (function() {
            container.scrollTop = container.scrollHeight;
        }).defer();
    }
});

Answer 2

Heh, ich war der Bau fast genau die gleiche Sache (eine Ajax-Konsole) und hatte Probleme mit meinem übergelaufenen div den ganzen Weg nach unten nicht Scolling.

Und Stack-Überlauf hat mir geholfen, es zu lösen! Hoffe, es hilft Ihnen auch!

Scrolling Übergelaufene DIVs mit JavaScript

EDIT: Meine Frage verwendet jQuery, aber das Problem ist nicht mit dem JS-Framework mit, es ist die CSS-Attribute Sie verwenden. Grundsätzlich müssen Sie Math.max (div.scrollHeight, div.clientHeight), weil einige Browser sind ein bisschen Buggy mit diesen Attributen erhalten.