alternative gesucht

[Darkmiller]

Moin Leute,

gibt es alternativen in durch Javascript festzustellen welche größe der Anwender benutzt und dann je nach größe eine CSS datei auszuwählen?

und gibt es eine möglichkeit bilder per Javascript, CSS oder PHP zu skallieren?

Gruß,
Darky

[VeN0m]

Ja, die JavaScript Objektreferenz "Screen" tut genau sowas.

Beispiel:

<script language="JavaScript" type="text/javascript">
<!--
var screenw = screen.width;
var screenh = screen.height;
var sc = screenw+"x"+screenh;
//-->
</script>

Das musst Du dann eben nur so auswerten, dass eine CSS-Datei includiert wird für jede Bildschirmgröße.

Bilder skallieren?

HTML:

<img style="width:400px;" src="beispielpfad/bild.jpg" />

CSS:

img {

	width:400px;

}

Per PHP gibt es eine Menge Image-Funktionen.

[Darkmiller]

das problem ist ich habe ganz viele hintergrundbilder wie z.B. eine box oder einen balken.

sieht im CSS-Code so aus:

#main{
background-image: url(mainbox.png);
width: 1030px;
height: 530px;
}

wenn ich jetzt beispielsweise die auflösung 1024x786 habe, kann ich ja nicht einfach sagen, schön, dann rechne ich 1030 * 0.8 und 530 * 0.8 weil dann ist das ganze ja nur abgeschnitten...

aber das mit dem javascript kann ich gebrauchen ;-)

[VeN0m]

Wie wäre es mit Prozentangaben?
Z.B., wenn ein Bild den gesamten Bildschirm bedecken soll:

#main {

background-image:url('mainbox.png');
background-repeat:repeat-x;
width:100%;
height:10%;

}

So als Beispiel.
Bei einem Bildschirm, der 1024 Pixel breit ist wären 100% eben 1024 Pixel, bei 1440 Pixel wäre das Gesamtbild 1440 Pixel lang etc.
Und vergiss nicht die Angabe "Background-repeat", da manche Browser beim fehlen dieser Angabe anders reagieren, als anderer (z.B. permanenter Repeat in alle Richtungen).

Ich hoffe mal, das hilft Dir etwas mehr weiter.

[Darkmiller]

das problem hätte ich gelöst^^ <br><br>ich hab mir gedacht was solls, kopier ich die bilder und stell die größe auf 80% des vorherigen bildes...<br><br>naja aber ich habe ein anderes problem <br><br>ich habe versucht das mit javascript (screen.width) zu lösen, da ich aber nicht weiß wie ich da dann links einsetzen kann bin ich gescheitert <br>

[n3v3r-ag4in]

@powersven

deine werte width und height beziehen sich auf die "container"-größe (#main) und nicht auf die größe des bildes im hintergrund

[VeN0m]

@n3v3r-ag4in: Keine Sorge, stimmt so. Wenn der Container 1000 Pixel breit ist und gesagt wird repeat-x wiederholt der Interpreter den Hintergrund so lange auf der X-Achse, bis die Maximalgröße (=1000 Pixel) erreicht sind .

[n3v3r-ag4in]

entweder wir reden aneinander vorbei....

was repeat bedeutet, verstehe ich schon, aber damit regelst du nicht die größe des hintergrundbildes.... wenn du nen 200 x 10 px großes bild nimmst, wird es eben so oft aneinander gereiht, bis die containergröße erreicht ist, es streckt oder staucht das bild jedoch nicht.

die frage lief aber darauf hinaus, wie er das bild skalieren kann. nehme an, er will sowas wie nen wallpaper in den hintergrund basteln....

[VeN0m]

Er möchte seine Seite an die einzelnen Bildschirme anpassen - Und da wäre statt einer Skallierung die Arbeit mit Prozentangaben, um die Seite zu dynamisieren besser geeignet.
Daher würde ich den Container auf 100% begrenzen (als Beispiel für etwas, was die ganze Breite einnehmen soll) und den repeat auf repeat-x stellen, statt verschiedene CSS-Dateien für verschiedene Bildschirmgrößen zu verwenden - Das meine ich .
Und von ihm habe ich das auch nicht anders verstanden... Siehe sein vorletzter Beitrag .

@Threadstarter: Was genau meinst Du mit Links? Hyperlinks?

[n3v3r-ag4in]

einigen wir uns auf nen unentschieden ^^

ach und relative breiten sind auch nur toll, wenn die auflösung wirklich hoch ist. wenn ich mir vorstelle 70 % von ner auflösung 800 x 600, da wird jede seite zu nem graus. und wenn ich mich recht entsinne, dann sollte jeder div, von vornherein eine relative breite von 100 prozent haben, oder irre ich, power-sven?

und jetzt komm nicht mit min-width