Layout für Chatroom (anpassbare Fenstergröße)

[Thomas]

Hallo,

ich versuche gerade ein Layout für einen Chatroom umzusetzen. Es besteht aus der Chatanzeige, einer Liste (für User/Räume) und einem Eingabefeld.

|------------|-----|
|            |Liste|
| Chat-      | ... |
| anzeige    | ... |
|            | ... |
|------------------|

Eingabefeld

Dabei soll sich das Layout der Fenstergröße anpassen (immer 100%). Die Breite der Liste und die Höhe des Eingabefeldes sind konstant. Anpassbar müssen folglich sein:
* Höhe der Liste
* Breite des Eingabefeldes
* Höhe und Breite der Chatanzeige

Gleichzeitig müssen die Chatanzeige und das Listenfenster scrollbar sein.

Wie kann ich das am besten realisieren?

Gruß Thomas

[Inita]

Hoi,

mit tables.

LG,
Inita

[Thomas]

Hoi,

mit tables.

LG,
Inita

Hallo,
ja ich habs auch schon mit Tabellen versucht, das Problem ist nur, dass <td> nicht scrollbar ist (zumindest wird overflow:scroll von dem Browsern nicht interpretiert).

Man könnte ja ein div-Element in das td einfügen und seine Größe auf 100% setzen. Allerdings ist das wohl nicht ganz standardkonform.

Wenn das div schließlich so voll ist, dass es scrollen muss, und man dann die Fenstergröße verändert, passt sich das div plötzlich an den Inhalt an, wird also höher als das Fenster selbst.

LG
Thomas

[Gernot Back]

Hallo Inita,

mit tables.

Also bei diesen Chatboxen kann ich tabellarische Daten nicht erkennen, was aber nicht heißt, dass ich darauf bei speziellen Layoutwünschen und wenn es sonst ohne Klimmzüge nicht geht, nicht auch zurückgreifen würde. Hier scheinen Tabellen aufgrund des Scrollwunsches aber eher hinderlich zu sein.

Floatende Scrollbare Elemente, die in anderen Blockelementen mit einer von visible abweichenden Overflow-Eigenschaft in einem Block-Formatting-Context zusammengefasst werden, scheinen mir die passendere Lösung zu sein:

Wunderwaffe Overflow

Gruß Gernot

[Inita]

Hoi,

ich habs so schnell die link angeschaut, aber es sieht so aus, im IE6 funktioniert nicht, oder sehe ich falsh :/.

LG,
Inita

[Struppi]

ich habs so schnell die link angeschaut, aber es sieht so aus, im IE6 funktioniert nicht, oder sehe ich falsh :/.

Ja:

Der Internet Explorer 6 verhaut die Beispiele erwartungsgemäß. Es sind verschiedene Hacks und Tricks nötig, damit er das Layout dennoch umsetzt.

Struppi.

[Harlequin]

Yerf!

Wie kann ich das am besten realisieren?

Mit einem Java-Applet. Siehe auch diesen Thread.

Ansonsten: nimm doch einfach Frames, das erleichtert dir dann auch das Aktualisieren des Chats, ohne dass die Eingabezeile davon betroffen ist.

Gruß,

Harlequin

[Thomas]

Yerf!

Wie kann ich das am besten realisieren?

Mit einem Java-Applet. Siehe auch diesen Thread.

Es handelt sich um einen Ajax-Chat.

Ansonsten: nimm doch einfach Frames, das erleichtert dir dann auch das Aktualisieren des Chats, ohne dass die Eingabezeile davon betroffen ist.

Da ich Ajax benutze brauche ich keine Frames und außerdem ist der Chat von der Anwendungslogik zum größten Teil fertig, ich müsste dann alles wieder umschreiben. Allgemein finde ich Frames eher suboptimal.