Proportionales Rechteck irgendwie erstellen CSS JS PHP

[YoCoSi]

Guten Abend meine Freunde,

ich habe eine Idee, die ich aber nicht umsetzen kann.

Ich möchte ein Proportionales Rechteck als Div erstellen z.B.

Um unteren rand ein Div das 30% so hoch ist wie die verfügbare höhe...

kein Problem eigentlich...Aber...mein Problem:

Wie kann ich dem DIV sagen, es soll z.B. doppelt so Breit sein wie es Hoch ist?

---------------------------------------

Dafür müsste das div ja wissen wie hoch es ist! Aber mit PHP komm ich da ja leider nicht weiter da es ja nicht weiß wie groß meine Auflösung ist.

Wie kann ich "da ich nicht so gut JS kann" die Verfügbaren Masse des Browserfensters oder die Höhe eines DIVS in Pixel auf die Nächste Seite übertragen um sie mit PHP GET oder POST auszulesen, Session würde auch gehen...Cookie sollte es nicht sein.

---------------------------------------

Bei dieser Lösung kann ich aber nicht Live das Browserfenster verändern (Größer Kleiner Enger Breiter Schmaler Länger etc).

Habt ihr eine Lösung für mich?

Vielen Vielen Dank für eine gute Antwort...und wenn es nicht möglich ist bitte auch sagen ;-)

YoCoSi

[Gunnar Bittersmann]

@@YoCoSi:

nuqneH

Dafür müsste das div ja wissen wie hoch es ist! Aber mit PHP komm ich da ja leider nicht weiter da es ja nicht weiß wie groß meine Auflösung ist.

Worun wirst du aufgelöst?

Und die Auflösung deines oder irgendweesen Monitors ist auch irrelevant.

Und richtig, mit PHP geht’s nicht so richtig. Glücklicherweise gibt’s ja eine clientseitige Scriptsprache.

<http://de.selfhtml.org/javascript/objekte/all.htm#offset_height@title=Höhe der Box auslesen> (vergiss document.all, sondern auf das bspw. per document.[ref:self812;javascript/objekte/document.htm#get_element_by_id@title=getElementById()] geholte Elementobjekt anwenden), verdoppeln und den Wert als <http://de.selfhtml.org/javascript/objekte/style.htm@title=Breite setzen> (Achtung: Einheit 'px' nicht vergessen!).

Die Funktion so früh wie möglich aufrufen (wenn das DOM fertig ist, Javascript als letzes vor </body> [PERFORMANCE-BP2]) und auch beim Eintreffen des resize-http://de.selfhtml.org/javascript/sprache/eventhandler.htm@title=Events (oder besser wie von [molily] beschrieben).

Qapla'