nicht angemeldet
overflow:scroll für einen Chat
Hallo,
ich habe ein div Container mit der Eigenschaft overflow:scroll
Jetzt möchte ich gerne, dass das div sich wie in einen Chat verhält.
Das heißt, wenn man ganz nach unten gescrollt hat, soll jedes mal wenn ein Inhalt(per ajax) dazu kommt, wieder komplett nach unten gescrollt werden.
ABER wenn man manuel nach oben scrollt soll die Scrollbar nicht automatisch nach unten gehen. Der Text soll also auf der Stelle stehen bleiben, auch wenn neuer Text dazu kommt, aber wenn man unten angekommen ist soll er immer zum neusten Text gescrollen.
Ist sowas machbar? Eine CSS alternative wäre mir auch recht.
-
Hi,
Das heißt, wenn man ganz nach unten gescrollt hat, soll jedes mal wenn ein Inhalt(per ajax) dazu kommt, wieder komplett nach unten gescrollt werden.
ABER wenn man manuel nach oben scrollt soll die Scrollbar nicht automatisch nach unten gehen.Die Scrollposition kannst du über scrollTop abfragen/setzen, und über den Eventhandler onscroll bekommst du mit, wenn der Nutzer selber scrollt. Daraus sollte sich was basteln lassen.
MfG ChrisB
--
“Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]-
Hi,
Das heißt, wenn man ganz nach unten gescrollt hat, soll jedes mal wenn ein Inhalt(per ajax) dazu kommt, wieder komplett nach unten gescrollt werden.
ABER wenn man manuel nach oben scrollt soll die Scrollbar nicht automatisch nach unten gehen.Die Scrollposition kannst du über scrollTop abfragen/setzen, und über den Eventhandler onscroll bekommst du mit, wenn der Nutzer selber scrollt. Daraus sollte sich was basteln lassen.
MfG ChrisB
Ok da hab ich ein bisschen ran gewerkelt.
Ich benutze
document.getElementById("content").scrollDown;
Wenn ich jetzt das formular sende, bekomme ich den Text mit ajax und php zurückgesendet.
Doch die darauf folgende anweisung nach unten zu scrollen wird übersehen. Weiß jemand weiter?-
Habs jetzt hingekriegt. Wenn die Scrollbar ganz unten ist wird sofort zum neuen Text gescrollt. Wenn sie auch nur etwas nach oben geschoben wurde dann bleibt sie auf der Stelle egal ob was hinzugefügt wird oder nicht.
Falls es jemand braucht:
var objDiv = document.getElementById("content");
var verschoben = objDiv.scrollHeight-100;
if(objDiv.scrollTop == verschoben) {
HIER DER BEFEHL UM TEXT ZU ADDEN
objDiv.scrollTop = objDiv.scrollHeight;
} else {
HIER DER BEFEHL UM TEXT ZU ADDEN
}-
Hi,
var objDiv = document.getElementById("content");
var verschoben = objDiv.scrollHeight-100;Wo kommt der Wert 100 her?
Wenn das die Höhe des Elements ist, kannst du das auch dynamischer halten, in dem du offsetHeight verwendest.if(objDiv.scrollTop == verschoben) {
HIER DER BEFEHL UM TEXT ZU ADDEN
objDiv.scrollTop = objDiv.scrollHeight;
} else {
HIER DER BEFEHL UM TEXT ZU ADDEN
}Zwei mal das gleiche in den beiden Zweigen zu machen, ist weniger sinnvoll.
"Text adden" willst du ja in jedem Fall, und danach ggf. noch den Scrollwert setzen.
MfG ChrisB
--
“Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]-
Zwei mal das gleiche in den beiden Zweigen zu machen, ist weniger sinnvoll.
"Text adden" willst du ja in jedem Fall, und danach ggf. noch den Scrollwert setzen.
MfG ChrisB
Okay danke für den hinweis mit offsetHeight. Ja stimmt mit der if anweisung kann man auch schlauer lösen. Wer so etwas braucht wird schon die nötigen Sachen daraus schnippseln können ;)
-
-
-
-