nicht angemeldet
Unterschiedliche CSS-Datei je nach Uhrzeit?
Hallo zusammen,
ich möchte gerne zwei unterschiedliche CSS-Dateien verwenden, damit der Betrachter die Seite je nach Uhrzeit im Tag- oder im Nacht-Design sieht.
Kann ich dieses direkt unter CSS lösen, oder komme ich bei der Abfrage der Uhrzeit um ein JavaScript nicht herum?
Vielen Dank sagt
Mattez
<www.mattez.de/demo/index.htm>
-
Hi,
ich möchte gerne zwei unterschiedliche CSS-Dateien verwenden, damit der Betrachter die Seite je nach Uhrzeit im Tag- oder im Nacht-Design sieht.
Kann ich dieses direkt unter CSS lösen, oder komme ich bei der Abfrage der Uhrzeit um ein JavaScript nicht herum?
Jein.
Mit CSS läßt sich das nicht lösen, denn hier ist Logik gefragt.
Aber Du kommst selbstverständlich leicht um Javascript herum.
Denn Du kannst das ganze serverseitig lösen.Andreas
-
Jein.
Mit CSS läßt sich das nicht lösen, denn hier ist Logik gefragt.
Aber Du kommst selbstverständlich leicht um Javascript herum.
Denn Du kannst das ganze serverseitig lösen.jep, eine möglichkeit, nur ist javascript besser, da die site hier nach der uhrzeit des clienten angepasst wird. wenn du ne nachtseite machst und deine seite serverseitig anpasst, siehts bei nem amerikanischen user dann irgentwie komisch aus, da ja dann die zeit deines servers in de zugrunde liegt
-
Jein.
Mit CSS läßt sich das nicht lösen, denn hier ist Logik gefragt.
Aber Du kommst selbstverständlich leicht um Javascript herum.
Denn Du kannst das ganze serverseitig lösen.jep, eine möglichkeit, nur ist javascript besser, da die
site hier nach der uhrzeit des clienten angepasst wird.
wenn du ne nachtseite machst und deine seite serverseitig
anpasst, siehts bei nem amerikanischen user dann irgentwie
komisch aus, da ja dann die zeit deines servers in de
zugrunde liegtWerde das Ganze wohl mit Javascript machen müssen, da ich keinen eigenen Server habe :-(
Wenn ich die Uhrzeit des Clienten mit getHours() abgefragt habe, wie
kann ich denn dann das Javascript veranlassen, die entsprechende CSS-Datei auszuwählen? (hab noch nicht soviel Ahnung von Javascript...)Schon mal Danke sagt
Mattez-
Hi
Werde das Ganze wohl mit Javascript machen müssen, da ich keinen eigenen Server habe :-(
Soll deine Seite nicht ins Netz?
Wenn ich die Uhrzeit des Clienten mit getHours() abgefragt habe, wie
kann ich denn dann das Javascript veranlassen, die entsprechende CSS-Datei auszuwählen? (hab noch nicht soviel Ahnung von Javascript...)Am besten mit document.write(). Du kannst zwar mit JS den Emementen andere class Typen zuweisen aber so gehts leichter:
var zeit = new Date();
var stunden = time.getHours();
if (stunden>6&&stunden<10) {
document.write('<LINK REL="stylesheet" HREF="morgen.css" TYPE="text/css">');
}
...Grüße aus Düsseldorf,
Aleksej
-
Hi
Werde das Ganze wohl mit Javascript machen müssen, da ich keinen eigenen Server habe :-(
Soll deine Seite nicht ins Netz?Hi
muß man denn immer einen eigenen Server haben um seine seite ins Netz zu stellen, ich kann mich noch gut an die Zeiten von Geocities,FortuneCity,VirtualAve & Co. erinnern..
Ich finde, seine Site auf seinem eigenen Server zu publishen sollte ein Privileg für besonders Bemittelte und (Hard)CORE Developer-Freaks bleiben und nicht jedem Hanswurst ermöglicht werden.
Tschau, Frank
-
Hallo, Aleksej,
Wenn ich die Uhrzeit des Clienten mit getHours() abgefragt habe, wie
kann ich denn dann das Javascript veranlassen, die entsprechende CSS-Datei auszuwählen? (hab noch nicht soviel Ahnung von Javascript...)Am besten mit document.write(). Du kannst zwar mit JS den Emementen andere class Typen zuweisen aber so gehts leichter:
var zeit = new Date();
var stunden = time.getHours();
if (stunden>6&&stunden<10) {
document.write('<LINK REL="stylesheet" HREF="morgen.css" TYPE="text/css">');
}
...Und wie soll man eine Alternative anbieten, wenn JavaScript ausgeschaltet ist? noscript-Elemente sind im head-Element nicht erlaubt.
Ich würde eher ein zwei Stylesheets vorgeben, von denen einer das andere aufhebt. Mit document.StyleSheets http://www.styleassistant.de/tips/tip20.htm und dem DOM http://home.t-online.de/home/dj5nu/js-dom-changestyle.html kann man dann gezielt das falsche Stylesheet deaktivieren.
Dass das eventuell Anzeigefehler einbringt, muss kalkuliert werden...Mathias
-
Hallo Mathias,
Und wie soll man eine Alternative anbieten, wenn JavaScript ausgeschaltet ist? noscript-Elemente sind im head-Element nicht erlaubt.
Ich würde eher ein zwei Stylesheets vorgeben, von denen einer das andere aufhebt. Mit document.StyleSheets http://www.styleassistant.de/tips/tip20.htm und dem DOM http://home.t-online.de/home/dj5nu/js-dom-changestyle.html kann man dann gezielt das falsche Stylesheet deaktivieren.
Dass das eventuell Anzeigefehler einbringt, muss kalkuliert werden...Du machst Dir das Leben aber schwer:
Mal angenommen Du hast 2 Stylesheets: nacht.css und tag.css, dann musst Du es nur noch so einrichten, dass diese beiden Stylesheets sich *komplett* überschreiben (d.h. nacheinander reingeladen werden können, ohne, dass es Darstellungsprobleme gibt) und dann ist es recht einfach:
Am Anfang ein
<link rel="stylesheet" type="text/css" href="nacht.css" media="screen" />
Dann ein Script-Bereich, der den Link-Tag für "tag.css" (oder umgekehrt) einfügt, wenn es Tag ist. So sehen nicht-JS-aktive[tm] User halt nur die Nacht-Style und JS-aktive[tm] User dagegen den Tag-Style, wenn es Tag ist. Mit 3 Stylesheets geht es genauso, da muss halt der Script-Bereich erweitert werden.
Grüße,
Christian
-
Hallo,
Und wie soll man eine Alternative anbieten, wenn JavaScript ausgeschaltet ist? noscript-Elemente sind im head-Element nicht erlaubt.
Ich würde eher ein zwei Stylesheets vorgeben, von denen einer das andere aufhebt. Mit document.StyleSheets http://www.styleassistant.de/tips/tip20.htm und dem DOM http://home.t-online.de/home/dj5nu/js-dom-changestyle.html kann man dann gezielt das falsche Stylesheet deaktivieren.Du machst Dir das Leben aber schwer:
Okay, ich gebe zu, ich habe komplizierter als nötig gedacht. :)
Mal angenommen Du hast 2 Stylesheets: nacht.css und tag.css, dann musst Du es nur noch so einrichten, dass diese beiden Stylesheets sich *komplett* überschreiben (d.h. nacheinander reingeladen werden können, ohne, dass es Darstellungsprobleme gibt) (...) Dann ein Script-Bereich, der den Link-Tag für "tag.css" (oder umgekehrt) einfügt
Das müsste man besser noch einmal sorgfältig prüfen, bevor man es einsetzt.
Ich sehe dennoch keine Notwendigkeit, Benutzern aus anderen Zeitzonen unbedingt eine an ihre Zeitzone angepasstes Stylesheet zu verpassen. Diese JavaScript-Krücken sind mir alleine schon deswegen suspekt, weil Abends/Nachts beide Stylesheets geladen werden (da am Tag die meisten Zugriffe aus derselben Zeitzone verzeichnet werden, wäre es klug, tag.css ohne JavaScript zu verLINKen). Auch wenn nacht.css lediglich als zusätzliches Stylesheet die Farben neudefinieren würde und es nur zu Zeiten eingebunden würde, zu denen sowieso wenige Benutzer zugreifen, bleiben trotzdem zwei HTTP-Anfragen (da muss der Benutzer womöglich eine halbe Sekunde länger warten, intolerabel! ;)).Im Übrigen könnte man so etwas mit einer Vorschaltseite machen, welche bei aktiviertem JavaScript den Zeitzonenparameter ausliest, per GET übergibt. Mit Session könnte der Parameter dann gespeichert werden. Nur eine Idee, Vorteile hat das wahrscheinlich nicht, nur eben dass die Seiten selbst kein JavaScript enthalten müssen.
Ich bin von beiden bzw. allen clientseitigen Lösungen nicht begeistert. zeit.de hatte vor zwei Jahren einmal ein tageszeittypisches Design (siehe http://web.archive.org/web/20000707010439/http://www2.zeit.de/nacht/kultur.html), dort wurde aber nach Serverzeit vorgegangen (Stylesheets wurden nicht verwendet - die fonts und bgcolors wurden templatebasiert eingebunden). Bei einer deutschsprachigen Seite ist das m.E. durchaus legitim, schließlich soll das Design widerspiegeln, welche Tageszeit in dieser Zeitzone ist. Letztendlich muss man natürlich selbst entscheiden, welche Lösung man favoriert. Zumindest muss ich eingestehen, dass die JavaScript-Lösung nicht allzu kompliziert wäre. :)Mathias
(irgendwie noch nicht ganz wach.)-
Hallo Mathias,
Das müsste man besser noch einmal sorgfältig prüfen, bevor man es einsetzt.
Klar. Sonst wundern sich die Leute mit aktiviertem JavaScript.
Ich sehe dennoch keine Notwendigkeit, Benutzern aus anderen Zeitzonen unbedingt eine an ihre Zeitzone angepasstes Stylesheet zu verpassen.
Wieso nicht, ist doch eine nette Spielerei. *g* Außerdem ist die Seite immer noch in nicht-JS-Browsern funktional.
Diese JavaScript-Krücken sind mir alleine schon deswegen suspekt, weil Abends/Nachts beide Stylesheets geladen werden (da am Tag die meisten Zugriffe aus derselben Zeitzone verzeichnet werden, wäre es klug, tag.css ohne JavaScript zu verLINKen). Auch wenn nacht.css lediglich als zusätzliches Stylesheet die Farben neudefinieren würde und es nur zu Zeiten eingebunden würde, zu denen sowieso wenige Benutzer zugreifen, bleiben trotzdem zwei HTTP-Anfragen (da muss der Benutzer womöglich eine halbe Sekunde länger warten, intolerabel! ;)).
Es gibt ja schließlich Connection: Keep-Alive. ;-)
Im Übrigen könnte man so etwas mit einer Vorschaltseite machen, welche bei aktiviertem JavaScript den Zeitzonenparameter ausliest, per GET übergibt. Mit Session könnte der Parameter dann gespeichert werden. Nur eine Idee, Vorteile hat das wahrscheinlich nicht, nur eben dass die Seiten selbst kein JavaScript enthalten müssen.
Im Gegenteil - da hast Du _noch_ mehr HTTP-Requests.
(Stylesheets wurden nicht verwendet - die fonts und bgcolors wurden templatebasiert eingebunden).
*würg*
Bei einer deutschsprachigen Seite ist das m.E. durchaus legitim, schließlich soll das Design widerspiegeln, welche Tageszeit in dieser Zeitzone ist. Letztendlich muss man natürlich selbst entscheiden, welche Lösung man favoriert. Zumindest muss ich eingestehen, dass die JavaScript-Lösung nicht allzu kompliziert wäre. :)
Das mit dem Design ist natürlich ein Argument, da muss er sich dann entscheiden.
Was hast Du denn eigentlich gegen JavaScript? Solange die Seite noch komplett benutzbar bei ausgeschaltetem JavaScript ist, warum nicht? WAI ist sicherlich ein Argument, aber wenn das auch mit berücksichtigt wird (ist hier der Fall), warum nicht JavaScript?
(irgendwie noch nicht ganz wach.)
Um 8:08? Was meinst Du, wann ich aufstehen muss, um in die Schule zu kommen? 5:30!
Grüße,
Christian
-
Hallo, Christian.
Ich sehe dennoch keine Notwendigkeit, Benutzern aus anderen Zeitzonen unbedingt eine an ihre Zeitzone angepasstes Stylesheet zu verpassen.
Wieso nicht, ist doch eine nette Spielerei. *g* Außerdem ist die Seite immer noch in nicht-JS-Browsern funktional.
Naja, schon. Wieso denke ich nur sofort an "Willkommen auf einer Homepage!!!" im Zusammenhang mit solchen JavaScript-Spielereien...
Im Übrigen könnte man so etwas mit einer Vorschaltseite machen, welche bei aktiviertem JavaScript den Zeitzonenparameter ausliest, per GET übergibt. Mit Session könnte der Parameter dann gespeichert werden. Nur eine Idee, Vorteile hat das wahrscheinlich nicht, nur eben dass die Seiten selbst kein JavaScript enthalten müssen.
Im Gegenteil - da hast Du _noch_ mehr HTTP-Requests.
Jein, es ist eine Kosten/Nutzen-Rechnung: Wenn ich auf jeder Seite zwei Stylesheets einbinde, habe ich im schlimmsten Falle pro Page Impression zwei Stylesheet-Requests (welche bei der zweiten PI mit 304 Not Modified beantwortet werden). Mit einer Vorschaltseite könnte man realisieren, dass bei x PIs pro Visit nur im schlimmsten Falle x Stylesheet-Requests eintrudeln, da auf jeder Seite nur ein Stylesheet eingebunden wird (nämlich das tageszeitspezifische).
Und: x+1 != 2x (wenn x>1 ;))
Das Problem ist nur, dass sich die Tageszeit während eines Visits ändern kann. Okay, das mit der Vorschaltseite ist eine schlechte Idee, merke ich gerade :), das System aber könnte man übernehmen:
1. Der Benutzer ruft irgendeine Seite des Angebots auf (Startseite||Unterseite).
2. nacht.css wird über eine bedingte Anweisung per JavaScript eingebunden, falls die Benutzerzeit $Nacht entspricht.
2. An das mit JavaScript eingebundene Stylesheet wird die Session-ID weitergegeben.
3. Der Session wird der Flag "JavaScript aktiviert und Nachtzeit" hinzugefügt.
4. Alle mit Session-ID aufgerufenen Seiten binden nur ein Stylesheet ein.
Ach nein! (Heureka! ;)) Das ist ja auch töricht, denn so oder so müssen tag.css und nacht.css eingeladen werden, deshalb ist es auch den Folgeseiten nicht möglich, nur *ein* Stylesheet zu laden, denn nacht.css sollte bestenfalls ein Zusatz für tag.css sein. Aber wenn man nacht.css vollständig und "standalone" macht, fallen auf den Folgeseiten immerhin die 304-Request auf tag.css weg, nach 3-4 PIs macht diese Trafficeinsparung die Größe von nacht.css wett.
Hm, ich gebe zu, eine simple JavaScript-Abfrage auf jeder Seite wäre einfacher als das obige System. :) Eine serverseitige Abfrage wäre am einfachsten.(Stylesheets wurden nicht verwendet - die fonts und bgcolors wurden templatebasiert eingebunden).
*würg*
Wieso würg, selbst heute noch setzen diese und viele andere große Seiten auf HTML-Formatierungen mit font usw. Dort kann man sich nicht leisten, NS4 CSS-formatierte Seiten zu liefern - "Interoperabilität" (aka muss auf allen Grafikbrowsern gut aussehen) um jeden Preis. (Bzw. zum würgen ist es zweifellos, aber immer noch gängig, auch wenn die genannte Seite zwei Jahre alt ist.)
Was hast Du denn eigentlich gegen JavaScript? Solange die Seite noch komplett benutzbar bei ausgeschaltetem JavaScript ist, warum nicht? WAI ist sicherlich ein Argument, aber wenn das auch mit berücksichtigt wird (ist hier der Fall), warum nicht JavaScript?
In diesem speziellen Fall finde ich eine serverseitige Überprüfung sinnvoller, sie spart viel Aufwand, Traffic und Ladezeit. (Im Winter bauen die wenigstens Seiten zusätzlich zu einem jahreszeittypischen Design eine JavaScript-Abfrage ein, nur weil auf der südlichen Hemisphäre Sommer ist.)
Abgesehen davon habe ich nur das Übliche gegen JavaScript. :) Es schadet hier natürlich niemanden, da stimmt ich dir zu.(irgendwie noch nicht ganz wach.)
Um 8:08? Was meinst Du, wann ich aufstehen muss, um in die Schule zu kommen? 5:30!
Tja, ich bin kein Schüler mehr. Dafür Nichtstuer, insofern war das relativ späte Aufstehen auf ein relativ sehr spätes Zubettgehen zurückzuführen.
Mathias
-
Hallo Mathias,
Wieso würg, selbst heute noch setzen diese und viele andere große Seiten auf HTML-Formatierungen mit font usw. Dort kann man sich nicht leisten, NS4 CSS-formatierte Seiten zu liefern - "Interoperabilität" (aka muss auf allen Grafikbrowsern gut aussehen) um jeden Preis. (Bzw. zum würgen ist es zweifellos, aber immer noch gängig, auch wenn die genannte Seite zwei Jahre alt ist.)
Na hör mal! NN4 kann doch <span style="color: #ff0000; font-size: 15px;"> und ähnliches. Sooo schlimm ist er nun auch nicht mehr. Klar, um Tabellenlayouts kommt man beim NN4 nicht herum (man kann ihm auch CSS-Layouts bis zu einem gewissen Grad beibringen, aber es sieht dann nicht wirklich gleich aus) Außerdem: Meine Seiten sollen in NN4 funktionieren und ein bisschen sich ans Orginal-Design anlehnen. Das reicht mir schon. (und den NN4-Usern vmtl. auch - sie kommen ja an die Infos)
Grüße,
Christian
-
-
-
-
-
-
-
Hi Mattez,
Werde das Ganze wohl mit Javascript machen müssen, da ich keinen eigenen
Server habe :-(was hat das miteinander zu tun?
Du brauchst doch keinen eigenen Server, um serverseitige Intelligenz
einzusetzen ...Viele Grüße
Michael
-
-
-
-
Danke an alle für die hilfreichen Tipps. Werde mich jetzt wohl erst noch etwas einlesen müssen ...
Viele Grüße,
Mattez