Frage zum Chat-Design

[DJ_Hero]

Hey Zusammen,
habe einen Chat, der einem Kumpel und mir gehört. Da ich ungerne etwas ''Standartmäßig'' lasse, habe ich den Chat eben umgebastelt (Designmäßig versteht sich). Aufjedenfall ist es doof, da bei unterschiedlicher Auflösung des Bildschirmes automatisch die Bilder doppelt und dreifach sind u.s.w. Kenne zwar die Scripts, aber entweder bin ich blind oder dumm - aufjedenfall nichts dazu passendes gefunden. Gibt es eine Möglichkeit, dass ich z.B. ein 1200x800 Bild nehme und als Hintergrund einfüge und dieser sich dann bei einer Auflösung von z.B. 1024 x 800 automatisch anpasst? Zudem auch mitscrollt, dass immer das selbe so bleibt?

Gruß,
Marco.

[BumBumBass]

soweit mir bekannt ist es nicht möglich für alle auflösungen den hg zu machen. hier in der scriptübersicht findest du aber ein script für externe hg bilder dass das mitscrollen verhindert. mit ein bischen trickserei ( hg bild zentrieren und scrollen verhindern, dazu einfabige hg farbe und gleichfarbigen hg bild rand ) kann man ein sehr gutes erbegnis für viele auflösungen finden. ich mach das schon lange so. ggf frage per pn bei mir an

[1. FC Keller]

ich hatte schonmal einen HTML- und CSS-Code veröffentlicht, der ein skaliertes Hintergrundbild ermöglichte... dummerweise finde ich ihn selbst gerade nichtmehr.

Man muss das Bild selbst auf einen Webspace hochladen... der Code sah wohl so oder so ähnlich aus:

Code: Alles auswählen

<div style='position:fixed;top:0px;left:0px;width:100%;height:100%;'><img src='BILD-URL' style='width:100%;height:100%;'></div><div>

Nachteile:
- funktioniert nicht im IE (da der Chat leider im Quirks-Mode läuft)
- funktioniert nicht ohne weiteres im Problemmodus
- bild wird durch das skalieren ggf. verpixelt

[ZischDings]

hab mal bissl rumgestöbert...

also das Hintergrundbild kann man normalerweise nicht strecken... es hat eine feste Größe in Pixeln.
Da der Chatstream aber keine feste Pixel-Größe hat, sondern von der Fenstergröße und somit unter anderem auch von der Bildschirmauflösung abhängig ist ist es nicht möglich ein Hintergrundbild zu erstellen das immer den kompletten Stream ausfüllt.

Ich habe aber gerade mal etwas getestet, womit es doch möglich sein könnte... allerdings wird es im Internetexplorer bis mindestens Version 6 nicht funktionieren, vielleicht auch 7 und 8 (konnte ich leider nicht testen), da er kein position:fixed unterstützt.
Außerdem überlagern sich momentan noch die Ankündigung und "powered By Webkicks"... hier würde es aber helfen noch ein paar Zeilenumbrüche am Anfang der Ankündigung einzufügen.

Dieser Code muss an den Anfang der Ankündigung (erste und dritte). Wenn die Grundscriptsammlung verwendet wird ist es egal, ob er vor oder hinter ihr eingefügt wird (da diese ja auch an den Anfang soll).

Code: Alles auswählen

<div style='position:fixed; width:100%; height:100%; top:0px; left:0px; z-index:2'><img src="http://deineSeite.irgendwas/hintergrundbild.gif" style='height:100%;width:100%;'></div><div style="position:absolute; top:0px; left:0px; z-index:500;">

Dieser Code erzeugt 2 Layer, einen für das Hintergrundbild und einen für den Vordergrund. Das Hintergrundbild wird nicht direkt als solches eingebunden, sondern über ein img-Tag und kann somit auf 100% höhe und breite gestreckt werden.
Die Idee dazu stammt nicht von mir... es hat, glaube ich, schonmal hier im Forum jemand einen Link zu einer Seite geschrieben, in der es so ähnlich beschrieben war, damals hatte ich aber noch keine Idee wie man das auf den Chat übertragen könnte.

»Quelle«

ein (kleiner) bereich "CSS" in der scriptübersicht wäre vielleicht gar nicht so übel, oder?

[Maxs]

Leider funtkioniert es nicht richtig im IE 9.
1. Es müssen mind. 5 Nachrichten geschrieben werden, bis mal eine Nachricht im IE im Stream erscheint (weil position:fixed nicht funktioniert)
2. powered By Webkicks wird überdeckt, egal wieviele Zeilenumbrüche mna am Anfang macht. (Ist auch im FF so)
3. Im IE läuft das Bild leider nicht mit (position:fixed...)

Ich kanns gern hinzufügen, aber es ist halt blöd, dass es nicht wirklich im IE funktioniert. Ich denke das würde viele davon abhalten, das zu benutzen. IE ist halt dann doch noch zu verbreitet.


//Edit: Was eigentlich total komisch ist. Der IE müsste doch seit Version 7 position:fixed unterstützen

[1. FC Keller]

//Edit: Was eigentlich total komisch ist. Der IE müsste doch seit Version 7 position:fixed unterstützen

richtig... aber nur wenn das dokument nicht im quirks-modus läuft... das ist beim Chat leider der Fall... eine doctype-Angabe sollte schon reichen damit es funktioniert.
Wenn man das jetzt einfach umstellt könnte es sein, dass einige Scripts und/oder Designs nichtmehr so funktionieren wie gedacht. (stichwort: boxmodel)

[IceRacer19]

Guten tag habe mal ne frage.

Habe jetzt den Script am laufen gebracht. Naja was Heißt script. damit ich die Hintergrund Fix habe.

kann ich das auch für Online-List ? Eingabe frame ? Werbe Frame?


das ist der script

Code: Alles auswählen

<style type="text/css">body , html{background-image: url("http://i66.tinypic.com/15epg4.jpg");bac ... ment:fixed; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}</style>

Zusastz frage: Wie schaffe ich das das Bild in der mitte Fixiert bleibt? Und nicht wenn xxxx chat nachrichten kommen das bild dann verschwindet

THX 4 Help

[Flächenblitz]

Hallo IceRacer,

Man braucht nicht unbedingt den fixierten Hintergrund, kann es aber machen. Empfehlenswert finde ich, dass man ein Bild nimmt, das keine sichtbaren Kanten beim "anreihen" ausbildet, ebenso sollte der Kontrast nicht sehr hoch sein, da man sonst viele Schriftfarben nicht nutzen kann, da sie auf Schattierungen, anderen Schriften etc. schwer zu lesen sind.
Ich zeige Dir mal, wo Du übers Admin-Menü vom Chat Deine Bilder hochladen und für Onlineliste, Eingabezeile etc. einstellen kannst (siehe Bild) .


Vielleicht hilft Dir das schon weiter.

Gruß Tobi

[DonFroschi]

damit kannst du dein HG bild feststellen... fixieren ..

Code: Alles auswählen

<style type="text/css">body{background-attachment: fixed;}</style>

[Syltfee]

Hallo,

also die Fixierung des Hintergrundes lief bisher super... nur seit ein paar Tagen wird der chat von oben her schwarz bzw bei einigen Usern blau und das Bild verschwindet... ich habe nix an den Einstellungen geändert... weiss jemand von Euch eine Lösung?

Folgendes Script wird genutzt:

<style type="text/css">body{background-attachment: fixed;}</style>