Cheatah: style="background 1 & background 2"

Hi,

das Thema fällt entweder in CSS, HTML oder JAVASCRIPT, aber mangels Lösung kann ich es nicht genau einordnen :-)

Also: Ich habe ein Frameset, in dem die äußeren Frames eine Art Ring um den Hauptframe ergeben (zumindest oben, links und unten). Sie haben einfach eine andere Farbe, in den Ecken ist zudem ein "rundes" Hintergrundbild. Dieses will ich jetzt in den Hauptframe "spiegeln", indem ich eine passende Grafik z.B. in die obere linke Ecke setze. Das habe ich so realisiert:

<body ... style="background-image:url(grf/upleft.gif); background-attachment:fixed; background-repeat:no-repeat;">

So weit, so gut, die Grafik soll also nur einmal in die linke obere Ecke, Text soll darüber fließen können. Das funktioniert im IE 4 perfekt, Netscape 4 ignoriert zwar leider den Wasserzeicheneffekt (was zu erwarten war), stellt es aber sonst korrekt dar.

Jetzt will ich aber eine passende Grafik "downleft.gif" in die untere linke Ecke setzen, und das ist mein Problem. Folgende Kriterien müssen erfüllt sein:

  • Die Grafik soll entweder _immer_ in der Ecke sein (ohne Zeitverzögerung beim Scrollen) oder _nur_ ganz unten auf der Seite (abhängig davon, ob das Wasserzeichen funktioniert).
  • Es muß so pixelgenau wie möglich sein; zumindest darf kein Pixel links und unten dazwischen bleiben (das wäre sonst eine weiße Linie im hellblauen Rand...)
  • Die Grafik soll _hinter_ dem Text liegen, also ihn nicht verdecken (Hintergrundbild halt).
  • Dabei soll es möglichst ohne JavaScript positioniert werden. Da dies aber extrem schwierig sein wird, lasse ich diesen Punkt mal als "optional" mitlaufen.
  • Browser, die diese Kriterien technisch nicht erfüllen können, sollen einfach gar nichts anzeigen. Auf gar keinen Fall soll plötzlich eine "fehlplazierte" Grafik im Raum stehen.
  • Wenn möglich möchte ich den bisherigen Seiteninhalt nicht in ein riesiges <div>-Konstrukt legen - wie gesagt, wenn möglich.

Tja, nicht ganz einfach. Ich habe mich bisher nur wenig an DHTML und CSS festgelesen, jedenfalls hat es noch zu keinem reellen Ansatz geführt. Zwar teste ich jetzt ein wenig rum, was alles unter welchen Umständen wie reagiert, aber vielleicht kann mir jemand mit etwas mehr Erfahrung in diesem Bereich ein wenig unter die Arme greifen :-)

Testseite stelle ich in Kürze (momentan ist meine Netzverbindung etwas instabil) unter http://cheatah.net/test/ zur Verfügung, dort wird dann die obere linke Ecke der Hauptseite Aufschluß über mein Anliegen geben. Vielleicht hilft die Optik ein wenig.

Danke an alle Helfer,

Cheatah

P.S.: Ich beginne jetzt übrigens, meine Seiten _wirklich_ HTML 4.0 ready zu machen, trotz "verbotenen" Dingen wie <table height="100%"> - und zwar indem ich meinen eigenen Standard definiere ;-) Was nicht alles möglich ist! Stefan, hast Du für Deine nächste SelfHTML-Version einen validator.w3.org-Check geplant? Wenn ja, kann ich mal ein Special über den Standard und die Anwendung desselben schreiben.

  1. Hallo Cheatah!

    Du verlangst aber auch nicht viel! ;-)

    »»Folgende Kriterien müssen erfüllt sein:

    • Die Grafik soll entweder _immer_ in der Ecke sein (ohne Zeitverzögerung beim Scrollen) oder _nur_ ganz unten auf der Seite (abhängig davon, ob das Wasserzeichen funktioniert).
    • Es muß so pixelgenau wie möglich sein; zumindest darf kein Pixel links und unten dazwischen bleiben (das wäre sonst eine weiße Linie im hellblauen Rand...)
    • Die Grafik soll _hinter_ dem Text liegen, also ihn nicht verdecken (Hintergrundbild halt).
    • Dabei soll es möglichst ohne JavaScript positioniert werden. Da dies aber extrem schwierig sein wird, lasse ich diesen Punkt mal als "optional" mitlaufen.
    • Browser, die diese Kriterien technisch nicht erfüllen können, sollen einfach gar nichts anzeigen. Auf gar keinen Fall soll plötzlich eine "fehlplazierte" Grafik im Raum stehen.
    • Wenn möglich möchte ich den bisherigen Seiteninhalt nicht in ein riesiges <div>-Konstrukt legen - wie gesagt, wenn möglich.

    Tja, nicht ganz einfach.

    Stimmt. Heute noch unmöglich.
    Ich habe dir eine Seite hochgeladen
    http://www.unet.univie.ac.at/~a9105535/forum/cheatah.html

    Ich habe mit und ohne JS etwas versucht.
    Wenn die Browser mal CSS2 verstehen würden, ginge die Sache sogar. (Auch ohne JS) IE5 sollte angeblich position:fixed; können! Eine dicke Lüge! Ändere mal das position:absolut; auf 'fixed'!

    Mit dem NS (und auch mit dem IE4) lohn sich es mal garnicht die Seite anzusehen.

    Hoffe für Ideen reicht es allemal?

    Grüße
    Thomas

    1. Hallo Cheatah!

      Im IE5 klicke im Fenster auf 'alles markieren', dann auf 'View partial source' und dann kanst du sehen wie der IE5 den JS-Code umschreibt. Auch arg!

      Grüße
      Thomas

    2. Hi Thomas,

      Du verlangst aber auch nicht viel! ;-)

      nö, würde mir doch niemals einfallen ;-)

      Tja, nicht ganz einfach.

      Stimmt. Heute noch unmöglich.

      Naja, zumindest nicht ideal möglich... Ich würde mich schon mit einer Lösung zufriedengeben, die im jeweiligen Browser bestmöglich erscheint. Bei Netscape 4 kann das z.B. auch sein, daß der zweite Hintergrund eben ganz am Ende des Dokuments steht.

      Ich habe dir eine Seite hochgeladen
      http://www.unet.univie.ac.at/~a9105535/forum/cheatah.html

      Ich habe mit und ohne JS etwas versucht.

      Vielen vielen Dank für die Mühe! Ist leider in den beiden 4ern nicht so, wie ich es mir vorgestellt habe... aber es gibt Hinweise.

      Wenn die Browser mal CSS2 verstehen würden, ginge die Sache sogar. (Auch ohne JS)

      Ja :-(

      IE5 sollte angeblich position:fixed; können! Eine dicke Lüge! Ändere mal das position:absolut; auf 'fixed'!

      Hatte ich schon versucht, danach war's total schief :-/

      Mit dem NS (und auch mit dem IE4) lohn sich es mal garnicht die Seite anzusehen.

      Ich habe leider neben Netsi 4.5 nur den IE 4, naja, und den neuesten Gecko-Milestone habe ich mir downgeloadet :-) Gecko macht den Wasserzeichen-Hintergrund immerhin mit, das ist schon mal ein gutes Zeichen.

      Hoffe für Ideen reicht es allemal?

      Ja, es gibt Anstöße, danke!

      Cheatah