• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Nach unten scrollen

Status
Für weitere Antworten geschlossen.

Asterixus

Aktives Mitglied
Huhu,

ich habe einen Chat programmiert, jedoch ist ein kleines Problem aufgetaucht. Meine Tester haben gesagt, es sei nervig, dass die neueste Nachricht immer oben sei. Könnt ihr mir bitte sagen, wie ich in einem Div mit JavaScript nach unten scrolle?

Code:
#dieses_div {width:600px;
height:320px;
overflow:auto;
}

Nun, wenn ich viel Chatinhalt habe, kommen ja Scrollbars (was ja erwünscht ist) nur meine Frage ist, wie ich die Scrollbars direkt nach unten bekomme.
 
Werbung:
Die vertikale Scroll-Position wird in der Eigenschaft scrollTop gespeichert, mit scrollHeight bekommst du die Höhe den scrollbaren Inhaltes.

Code:
document.getElementById('scroll').scrollTop = document.getElementById('scroll').scrollHeight;

Ist vielleicht nicht das sauberste, aber funktioniert in FF3, IE7 und Opera 9.60
 
Hallo,

sorry, aber ich habe den Thread immer übersehen ^^

Es geht leider nicht, es wird nichts gescrollt. Vielliecht mal ein bisschen mehr Code ^^
PHP:
function getXmlHttpRequestObject() {
    if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    } else if(window.ActiveXObject) {
        try {
            return new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                return new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
        }
    }
}
var ajax_req = getXmlHttpRequestObject();
function chat() {
    if (ajax_req.readyState == 4 || ajax_req.readyState == 0) {
        ajax_req.open("GET", "ajax.php?action=chat&id="+Math.random()+Math.random()+Math.random(), true);
        ajax_req.onreadystatechange = h_chat;
        ajax_req.send(null);
    }
}
function h_chat() {
    if (ajax_req.readyState == 4) {
        document.getElementById("chat_content").innerHTML = ajax_req.responseText;
        document.getElementById("chat_content").scrollTop = document.getElementById("chat_content").scrollHeight;
    }
}
 
Werbung:
Status
Für weitere Antworten geschlossen.
Zurück
Oben