Abfrage höhe browserfenster und verweis

Hallo zusammen,

brauche Hilfe bei einem wahrscheinlich kleinen Problem.
Ich möchte gerne die aktuelle Größe des aktiven Browserfenster (NICHT Monitordarstellung) beim Nutzer abfragen und für z.B. Browserfenster mit weniger als 500px Höhe ein anderes CSS ansteuern als für grosse Browserfenster. Im Regelfall soll der Container zentriert im Browserfenster platziert sein, bei geringen Höhen allerdings (Netbook etc.) verschwindet meine Hauptnavigation irgendwann bevor gescrollt werden kann. Für diese Fälle möchte ich den Container über ein anderes Stylesheet oben im Browserfenster ausrichten. ABER: Wie mache ich das? Im HTML oder im CSS? Kann mir jemand einen passenden Vorschlag machen? ( http://www.b-guided.de/KSM/IndexTEST.html )

Gruss und danke im voraus

Hallo b-guided!

Die Abfrage der Parameter des Browserfensters (Größe, Position usw. - sowie das Verschieben, Nachstellen/Größenänderung etc.) lässt sich nur mit XHTML/DOM verwirklichen. Also muss JavaScript (JScript) zum Einsatz kommen. -
Doch da kenne ich mich wenig aus; deshalb bitte ich Dich, einmal http://jendryschik.de/ oder besser vielleicht http://de.selfhtml.org/ zu konsultieren. (Stichwort: Objektreferenz „window“ für das Browserfenster und „outerHeight“/„outerWidth“.)
Ansonsten solltest Du mit Google auch fertige Skripte finden, Suchbegriffe wie genannt.

[…]
diese Fälle möchte ich den Container über ein anderes
Stylesheet oben im Browserfenster ausrichten. ABER:
Wie mache ich das?
Im HTML oder im CSS?

Über eine sog. Browser-Weiche. In diesem Fall eine JavaScript-basierte und anhand der ermittelten Werte für Höhe/Breite des Fensters.

Okay, ^das^^ wird gehen, aber sinniger wäre bei Deinem Kontext aber etwas anderes:

Nämlich eine serverseitige Browserweiche, die ermittelt, von welcher Art Gerät gesurft wird. Denn PDA/Netbooks usw. verwenden garantiert KEINE „normalen“ Webbrowser-Versionen, sondern angepasste. Da steht dann z.B. in der Browserkennung, die an den Server übermittelt wird drin: „IE 8.0.0001.23/WAB“ oder „…/PDA“ statt wie vom normalen PC z.B. „IE 8.0.0001.23“. Meist lässt sich darüber auch das verwendete Betriebssystem inkl. Unterversion ermitteln. (Siehe /logs/ Verzeichnis auf Deiner Homepage-Adresse.) - Aber DAS ist ein sehr heißes Thema; dazu musst Du erst einmal alle wichtigen Browserkennungen zusammentragen bzw. aus den logs auswerten. Nur woher nehmen, wenn noch keiner Deine Site angesurft hat? (Dafür habe ich leider KEINEN direkten Link. Vielleicht wirst Du bei http://browsers.evolt.org/ fündig! Oder eben auf einer anderen Site, die „Webmaster“ Hilfestellung gibt…)

Außerdem habe ich mal in Deinen Quellcode gespickt:

Ganz schlecht wirken sich (letztlich!) die von Dir verwendeten Klassen- und Stilnamen aus, Beispiel:

 ...
 ...
 ...


Du solltest besser "logische Namen" vergeben und nicht mit rechts, links, oben, unten, rot, gruen, blau usw. konkretisierte Namen. - Denn irgendwann einmal entscheidest Du vielleicht, dass rechts unten, unten oben und rote Schrift nunmehr schwarz sein soll. - Was dann?! (Dann musst Du nicht nur das CSS ändern, sondern gleich den ganzen HTML-Code inklusive der zugewiesenen Attribute.)

Wie wäre es bspw. mit "hauptmenu" (statt "TextNavigationUnten") und "objektmenu" (statt "TextnavigationOben").

Jens Meiert (http://meiert.com/) nennt diese Praxis unter seinem Beitrag "Eleganter Code durch kontextuelle Selektoren" (siehe: http://meiert.com/de/publications/articles/20050107/) und in einem anderen Artikel, den ich jetzt auf Anhieb nicht mehr wiederfinde. -

Aber, schau selbst einmal auf dieser Website: Meiert.com ist m.E. eine sehr wertvolle Site, wenn man sich einen guten Quellcode und gutes CSS selbst nach eigenen Vorstellungen erarbeiten will.

Soweit für heute.

LG, Mr. Darcy

PS… noch ein kleiner Nachtrag
Es gibt BTW auch schöne fertige Menü-Führungen, die vollkommen ohne Tabellen-Stile auskommen, also ganz ohne TABLE, TR, TD…

Das erleichtert die spätere Pflege der Site (Relaunch) ungemein.

Vom visuellen Stil her hast Du oben und unten eine sog. „Brotkrummen“-Menüführung gewählt. (Die liese sich, ganz leicht per CSS und DIV-Container bzw. UL/LI-Listen in ein vertikales (rechts/links, wie auch immer) Menü umformatieren.

Link-Tipp: http://drweb.de/

q.e.d.

Hallo Mr. Darcy

danke für die schnelle Antwort und die vielen Tipps und Suchbegriffe. Werde mich
gleich mal ransetzen und ein wenig stöbern …

LG

Vielleicht noch ein kleiner Hinweis zu „Dr. Web“:

Mit der Suche nach „Menü“ fand ich einige lesenwerte Artikel. Es ist aber so, dass Dr. Web [1] einige Artikel frei zugänglich macht und [2] andere, die mehr in die Tiefe gehen und auch eher für die Profis gedacht sind, nur im Abo (Dr. Web Plus) freischaltet…

[1] http://www.drweb.de/magazin/ein-men-auf-die-schnelle/
[2] http://www.drweb.de/magazin/miese-menus//#more

CU Mr. Darcy

hilft Dir
http://www.ajaxschmiede.de/javascript/fenstergrose-u…
erst mal weiter?

Nochmal Hallo b-guided!

Habe eben noch etwas in Sachen „Browserkennung“ gefunden; ich zitiere 'mal aus dem Artikel:

 [...]
 Das [Surf-Pad] Joojoo wurde in Singapur von dem 
 Unternehmen Fusion Garage entwickelt. [...]
 Der Internet-Tablet-PC basiert auf einem von 
<u>Fusion Garage entwickelten Betriebssystem</u>, 
 das wiederum auf einem <u>Linux-Kernel</u> und 
 der <u>Browser-Engine Webkit</u> basiert.
 [...]

Die abfragbaren Merkmale habe ich unterstrichen.

HTH, CU Mr. Darcy

Meine Welt sind Mainframes und habe wenig mit Browser zu tun. Es tut mir Leid nicht helfen zu können!