Baumstrukturmodus | Linearer Modus

Miniko · (Dieser Beitrag wurde zuletzt bearbeitet: 16.01.2010 08:02 von Miniko.)

Hallo...

ich habe ein fixes Hintergrundbild [background: url(...) fixed;], das für meine Monitorauflösung prima paßt. Nun würde ich es gerne so gestalten, daß ich andere Hintergründe für andere Monitorauflösungen anbiete. Habe ein Mybb-Forum.

Weiß da wer etwas, wie das geht? Wenn es zu kompliziert ist, muß ich was anderes mir überlegen.

**Jonnsn** · 16.01.2010, 18:04

Hi

Du könntest das Bild als normales Bild (<img> ) Im hintergrund platzieren und Strecken... bei background gibt es keine Größenangaben (ich glaube CSS3 wird es haben).
Oder per Javascript die Größe abfragen und je nachdem ein anderes Bild als Hintergrund laden (screen.Height und screen.width).

Gruß

Miniko · 17.01.2010, 11:15

Hi Jonnsn..

danke für den Tip mit Javascript. Habe keine Ahnung, aber ein Script ich fand im Netz *hüstel*. Muß ich auch im CSS für die Background-Eingabe etwas verändern? Keine Ahnung, eine Art Bild-Variable?

Momentan steht da jene Zeile:

background: url(images/background.jpg);

-> damit ist ja nur ein Hintergrund definiert

Oder ganz herausnehmen die Zeile?

ICh habe das Script in den Body-Tag gepackt, funktioniert leider nicht, es tut sich nichts, aber auch keine Fehlermeldung erscheint.

Hm... mit dem Image, statt Hintergrund. Mir kommt da noch eine Idee. Ich hatte mal einen Blog, da waren an den Seitenkanten (rechts/lins) vom Content oder Container faktisch Bilder angefügt. Vielleicht bekomme ich das hin, die würden sich der jeweiligen Monitorauflösung anpassen (mitvergrößern oder mitverkleinern).

Gruß Miniko

**Jonnsn** · 17.01.2010, 12:29

Hi

Um dir da weiter zu helfen sollte man das skript kennen - oder am besten einen Link zu der Seite in die du das skript eingefügt hast. Im CSS kannst du da nichts anpassen - sowas wie Variablen gibt es dort nicht...

Gruß

Miniko · 17.01.2010, 15:41

Hi Jonnsn...

ja, wollte es erst hineinsetzen, war mir dann unsicher, ob man das darf. Ist aus einem anderen Forum... irgendwo:

PHP-Code:

<script LANGUAGE="JavaScript">
<!--
document.write("<body ")
if (screen.width <= "640")
{
document.write('marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" rightmargin="0" background="/img/main-background640.jpg">');
}
else if (screen.width <= "800")
{
document.write('marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" rightmargin="0" background="/img/main-background800.jpg">');
}
else if (screen.width <= "1024")
{
document.write('marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" rightmargin="0" background="/img/main-background1024.jpg">');
}
else if (screen.width <= "1280")
{
document.write('marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" rightmargin="0" background="/img/main-background1280.jpg">');
}
else if (screen.width <= "1600")
{
document.write('marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" rightmargin="0" background="/img/main-background1600.jpg">');
}
// -->
</script>
<noscript>
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" rightmargin="0" background="/img/main-background1024.jpg">
</noscript> 

Bei mir habe ich dann die Pfade verändert meinen Bildpfaden entsprechend. Javascript kann ich gar nicht, aber vielleicht habe ich es an falscher Stelle eingefügt. Da steht ja "document.write("<body ")"

Und ich packte - genauso wie oben eingestellt - es im MybbForum in die "Forenanzeige Templates" und dort ins "forendisplay" zwischen den <body>-Tag.

PHP-Code:

<html>
<head>
<title>{$mybb->settings['bbname']} - {$foruminfo['name']} </title>
{$headerinclude}
{$rssdiscovery}
<script type="text/javascript">
<!--
    lang.no_new_posts = "{$lang->no_new_posts}";
    lang.click_mark_read = "{$lang->click_mark_read}";
// -->
</script>

</head>
<body>

[Also genau hier hinein]

{$header}
{$moderatedby}
{$usersbrowsing}
{$rules}
{$subforums}
{$threadslist}
{$footer}
</body>
</html> 

Vielleicht ist da was doppelt gemoppelt mit dem "document.write("<body ")"(?).

Im Internet fand ich, daß dahinter eigentlich auch ein Semikolon zu stehen hätte: document.write("<body "); Aber damit funktionierte es auch nicht.

Gruß an Dich : )

**Jonnsn** · 17.01.2010, 15:54

Hi,

document.write bewirkt, dass an der Stelle, an der sich das script befindet <body in den Quelltext geschrieben wird. In diesem Fall ist es also in der Tat doppelt gemoppelt. Du müsstest den originalen <body>-Tag rauswerfen (nur den öffnenden!).
Das mit dem Semikolon am Ende eines Befehls ist korrekt.

Gruß

Miniko · 17.01.2010, 16:16

Freudiges Ooo-hoh. laugh

Da funktioniert was. Der doppelte Anfang vom Body-Tag war es. Klasse, danke Dir, Jonnsn.
Nun muß ich das nur noch anständig machen mit den einzelnen Backgrounds, hatte nur Probehintergrund zum Testen hochgeladen.

Gruß Miniko

m2000 · 01.03.2010, 14:41

Die Lösung ist so sicherlich möglich - aber wohl nicht so wirklich optimal.
Du fragt die Auflösung des Bildschirms ab - die hat aber nicht zwangsläufig etwas mit der Breite des Browsers zu tun (da wäre vielleicht window.innerWidth besser)

xaver · 01.03.2010, 16:57

Würde das niemals so machen.....

Wenn dann eine Hintergrundgrafik in div oder so und dann ein verlauf oder farbe...

Nicht jeder hat schnelles DSL dann kannst genauso ne 1920 breites Bild reinhauen....