Hi,
in meiner neu designeten Site möchte ich jede einzelne (Inhalts-)Seite so erstellen, daß oben links und unten links jeweils eine Grafik eingefügt wird (abgerundete Ecke). Nur der Optik wegen, also mit der Bedingung "so gut, wie es der Browser halt kann, aber nicht auf Deubel komm raus". Oben links ist kein Problem, das habe ich bereits idealisiert:
<body style="background-image:url(grf/upleft.gif); background-attachment:fixed; background-repeat:no-repeat;">
Erklärung:
Nicht-CSS-fähige Browser (also solche, die einen Hintergrund ewig wiederholen) stellen nix dar. Alle anderen haben die Grafik schön in der Ecke - sofern möglich sogar permanent, also auch beim Scrollen. Die Grafik bleibt dabei im Hintergrund, was besonders vorteilhaft ist.
Etwas ähnliches möchte ich jetzt für die Ecke unten links haben. Mein aktueller Stand ist folgender:
<div id="ecke" name="ecke" style="position:absolute; z-index:-1; left:0px;"><img src="/test/grf/downleft.gif" width="130" height="80" alt=""></div>
<script language="JavaScript" type="text/javascript">
<!--
if (document.layers) if (document.ecke) if (document.ecke.top) {
document.ecke.top = document.ecke.top - 76;
if (document.ecke.top+76 < window.innerHeight) { document.ecke.top = window.innerHeight-76; }
}
// -->
</script>
Erklärung:
Die Grafik wird bei CSS-fähigen Browsern am linken Rand erzeugt, ansonsten da, wo sie eben gerade ist (_nicht_ ideal). "z-index" hat offenbar keine Auswirkungen, zumindest bleibt die Grafik im Vordergrund (_nicht_ ideal). Mit JavaScript wird der Layer mit der Grafik derzeit nur bei Netscape 4 (_nicht_ ideal) zunächst nach oben verschoben, damit nicht zuviel Platz verschenkt wird, dann bei kleinen Seiten an den unteren Rand - und zwar vier Pixel zu tief, weil window.innerHeight nicht die korrekte Höhe liefert (ebenfalls _nicht_ ideal). Beim MSIE wird einfach nur die Grafik hingeklatscht, was besonders bei kleinen Seiten unschön ist, weil ein weißer Rand darunter bleibt.
Nun hoffe ich auf Hilfe zu folgenden Fragen:
- Wie ignoriere ich _mit möglichst geringem Aufwand_ Browser, bei denen die Darstellung nicht ideal sein kann?
- Kann ich die Grafik irgendwie in den Hintergrund bringen (weniger wichtig)?
- Wie kriege ich die Grafik beim MSIE an den unteren Bildschirmrand, und zwar entweder ganz unter die Seite (wie bei Netscape), oder besser als Wasserzeichen in die Ecke, analog zu oben links?
- Gibt es einen Weg, die Ungenauigkeit von window.innerHeight bei Netscape zu berechnen oder zu umgehen, so daß die Grafik auch wirklich ohne Rand unten ist?
Ich möchte tunlichst vermeiden, den gesamten Code mit JavaScript auszugeben, weil ich dann zusätzlich zur Prüfung den Code mehrfach auf jeder Seite mitführen muß. Leider fand ich keinen Weg, die Grafik beim MSIE nachträglich zu positionieren (bin ich nur zu blöd dazu?), und auch eine Positionierung "von unten" klappt nicht (CSS 2.0, und wer unterstützt das schon?). Den Wasserzeicheneffekt scheint der MSIE auch nur beim Seitenhintergrund zu beherrschen.
Hoffentlich hat jemand bis hierhin gelesen und kann mir dann auch noch helfen *g* :-)
Danke schon mal,
Cheatah