nicht angemeldet
(Tages-) Zeitabhängiges Hintergrundbild
Hallöchen!
Nach langer Suche und Rumbastlerlei (als blutige JS-Anfängerin) hab ich mir endlich ein miniscript geschustert, was ein passendes Hintergrundbild abhängig von der Tageszeit anzeigt.
UN ZWAR:
<script language="JavaScript">
<!--
var jetzt = new Date();
var stunde = jetzt.getHours();
if(stunde >=8 && stunde <= 18) {
document.write("<body background='hg.jpg'>")
//nach 6 Uhr bis 18 Uhr
}
else {
document.write("<body background='hg_nacht.jpg' >")
//nach 18 Uhr bis 6 Uhr
}
//-->
</script>
Bei mir funktionierts... bin ganz stolz und dachte mir, ich poste es mal, da ich bei meienr Suche auch verzweifelt bin.
Sollten Fehler drin sein, bitte korrigieren!
-
Hallo Anne!
<script language="JavaScript">
Wo bleibt Cheatah? ;-) ERROR: Required attribute "type" missing.
<!--
var jetzt = new Date();
var stunde = jetzt.getHours();if(stunde >=8 && stunde <= 18) {
document.write("<body background='hg.jpg'>")
//nach 6 Uhr bis 18 Uhr
}else {
document.write("<body background='hg_nacht.jpg' >")
//nach 18 Uhr bis 6 Uhr
}
//-->
</script>Naja, über den JS-Stil will ich nichts sagen, aber die Formatierung
des Seitenhintergrundes solltest du dann doch per CSS regeln.
Was spricht zudem dagegen, _nur_ den Hintergrund zu ändern, und nicht
das <body> mit von Javascript auszugeben. Schließlich fiele das weg,
wenn jemand kein Javascript aktiviert hat. Und das ist schlecht.Bei mir funktionierts...
Das ist zwar gut, aber nicht alles.
℆, ℒacℎgas
--
Bei der intendierten Realisierung der linguistischen Simplifizierung
des regionalen Idioms resultiert die Evidenz der Opportunität extrem
apparent, den elaborierten und quantitativ opulenten Usus nicht assi-
milierter Xenologien konsequent zu eliminieren!-
Hallo Lachgas! Danke für die Antwort!
Wo bleibt Cheatah? ;-) ERROR: Required attribute "type" missing.
...hat Urlaub ;)
Beser so: <script type="text/javascript" language="JavaScript"> ?
<!--
var jetzt = new Date();
var stunde = jetzt.getHours();if(stunde >=8 && stunde <= 18) {
document.write("<body background='hg.jpg'>")
//nach 6 Uhr bis 18 Uhr
}else {
document.write("<body background='hg_nacht.jpg' >")
//nach 18 Uhr bis 6 Uhr
}
//-->
</script>Naja, über den JS-Stil will ich nichts sagen, aber die Formatierung
des Seitenhintergrundes solltest du dann doch per CSS regeln.Hab ich bei den Unterseiten auch gemacht. Das Problem der Page war nur, dass ausschliesslich der Hintergrund der Startseite je nach Tageszeit variieren sollte. Da dachte ich, das kann ich nicht mit CSS allein nicht realisieren.. (oder doch?)
Was spricht zudem dagegen, _nur_ den Hintergrund zu ändern, und nicht
das <body> mit von Javascript auszugeben. Schließlich fiele das weg,
wenn jemand kein Javascript aktiviert hat. Und das ist schlecht.Hm. Du hast recht. Weiss nicht, wie das gehen soll. Was wäre wenn ich eine optionale JS-Abfrage einbaue, die je nach Tageszeit unterschiedliche Stylesheets benutzt und wenn JS deaktiviert ist, dass Standard-Sheet. Macht das Sinn oder ist das zu kompliziert?
Bin für jeden Tipp dankbar!
Anne
-
I'd suggest:
- PHP date(), time()
- CSS (x mal, je nach belieben)
- eine Schleife im Header, wo das jeweilige Stylesheet includiert wird
Besser, weil nicht jeder JS hat/kann, es weniger Arbeit macht und flexibler ist.
Man kann auch mehrere Stylesheets einbinden. D.h. Du musst nihct alles neu deklarieren, sondern einfach nur die einzelnen Variablen überschreiben:
Beispiel:
...
<style type="text/css" media="screen"><!-- @import url("css/default.css"); --></style>if($nacht) echo '<style type="text/css" media="screen"><!-- @import url("css/nacht.css"); --></style>';
In der nacht.css wird z.B. nur body neu deklariert:
body {
background: url(bg_nacht.jpg) no-repeat;
}Es wird also einfach nur body neu deklariert und es kann jeder sehen und ist sehr einfach ;D
(Ich hoffe du kannst PHP)Gruß
Hamster-
hi,
Man kann auch mehrere Stylesheets einbinden. D.h. Du musst nihct alles neu deklarieren, sondern einfach nur die einzelnen Variablen überschreiben:
Welche Variablen? CSS kennt keine Variablen.
Es wird also einfach nur body neu deklariert und es kann jeder sehen und ist sehr einfach ;D
(Ich hoffe du kannst PHP)Wozu?
Man kann hier doch ruhig bei JS bleiben.Ich würde vorschlagen, im CSS mehrere Klassen für body zu definieren, mit unterschiedlichen Hintergrundbildern, sowie einen Default für body ohne Klasse.
Je nach Uhrzeit kann man dann nach dem Laden der Seite per JS dem body eine entsprechende Klasse verpassen (className).gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
So, jetzt habt Ihr mich komplett verwirrt. Habe leider weder Ahnung von PHP noch von irgendwelchen Schleifen und ich denke, ich entscheide mich für die verschiedenen Stylesheets...
Also wäre das dann folgendermaßen im head (??):
<script type="text/javascript" language="JavaScript">
<!--
var jetzt = new Date();
var stunde = jetzt.getHours();if(stunde >=8 && stunde <= 18) {
document.write('<LINK REL="stylesheet" TYPE="text/css" HREF="css/tag.css">')
//nach 6 Uhr bis 18 Uhr
}else {
document.write'<LINK REL="stylesheet" TYPE="text/css" HREF="css/nacht.css">')
//nach 18 Uhr bis 6 Uhr
}
//-->
</script><NOSCRIPT>
<link rel="stylesheet" type="text/css" href="css/style.css">
</NOSCRIPT>Würde das wohl funzen?
-
hi,
So, jetzt habt Ihr mich komplett verwirrt. Habe leider weder Ahnung von PHP noch von irgendwelchen Schleifen und ich denke, ich entscheide mich für die verschiedenen Stylesheets...
_Wozu_ mehrere verschiedene Stylesheets?
Klassen bieten sich doch hier an.Würde das wohl funzen?
Das wäre immer noch Murks - <noscript> darf (leider) nicht innerhalb von <head> stehen.
Versuch's doch mal so, wie ich es vogeschlagen habe - lege in deinem Stylesheet mehrere Klassen für body an, meinetwegen body.tag und body.nacht. Außerdem eine Defaultformatierung für body, falls Javascript gar nicht verfügbar ist.
Und per Javascript weist du dann nach dem laden der Seite body in Abhängigkeit von der Uhrzeit eine dieser Klassen zu (wie ich bereits schrieb, über className).gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hallo!
Das wäre immer noch Murks - <noscript> darf (leider) nicht innerhalb von <head> stehen.
Versuch's doch mal so, wie ich es vogeschlagen habe - lege in deinem Stylesheet mehrere Klassen für body an, meinetwegen body.tag und body.nacht. Außerdem eine Defaultformatierung für body, falls Javascript gar nicht verfügbar ist.
leuchtet ein.
So?
Und per Javascript weist du dann nach dem laden der Seite body in Abhängigkeit von der Uhrzeit eine dieser Klassen zu (wie ich bereits schrieb, über className).
<script type="text/javascript" language="JavaScript">
<!--
var jetzt = new Date();
var stunde = jetzt.getHours();if(stunde >=8 && stunde <= 18) {
document.write('getElementById("body.tag").href = "css/style.css";')
//nach 6 Uhr bis 18 Uhr
}else {
document.write('getElementById("body.nacht").href = "css/style.css";')
//nach 18 Uhr bis 6 Uhr
}
//-->
</script>Sollte JS deaktiviert sein, nimmt sich der Browser automatisch die normalen Body-Formatierungen des Stylesheets?
Danke für die Hilfe!
-
hi,
Und per Javascript weist du dann nach dem laden der Seite body in Abhängigkeit von der Uhrzeit eine dieser Klassen zu (wie ich bereits schrieb, über className).
if(stunde >=8 && stunde <= 18) {
document.write('getElementById("body.tag").href = "css/style.css";Nein, immer noch ziemlicher Murks.
Wieso sollte body ein href-Attribut haben, und welchen Sinn sollte es haben, diesem den URL einer CSS-Ressource zuzuweisen?Ich sagte, dass du der Eigenschaft className des body einen entsprechenden Wert zuweisen sollst - nix mit dynamischen Ausgaben von Elementen per document.write etc.
Ein fest im HTML vorhandener body, auf dessen Eigenschaft className anschließend [1] zugegriffen wird - dazu reicht
document.body.className = "xyz";
vollkommen aus.Sollte JS deaktiviert sein, nimmt sich der Browser automatisch die normalen Body-Formatierungen des Stylesheets?
Wenn keine Klasse per JS zugewiesen wird, greifen die "normalen" Formatierungen für body, die nicht von diesem Selektor abhängig sind, ja.
[1] _nach_ dem Laden der Seite, also per onload o.ä., aber auch das sagte ich ja bereits.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
-
-
-
Hallo.
So, jetzt habt Ihr mich komplett verwirrt.
"Mission accomplished."
MfG, at
-
-
Hallo.
Wozu?
Um hierbei nicht von den Fähigkeiten oder Einstellungen client-seitiger Software abhängig zu sein.
Ich würde vorschlagen, im CSS mehrere Klassen für body zu definieren, mit unterschiedlichen Hintergrundbildern, sowie einen Default für body ohne Klasse.
Je nach Uhrzeit kann man dann nach dem Laden der Seite per JS dem body eine entsprechende Klasse verpassen (className).Klassennamen lassen sich aber auch server-seitig sehr gut ändern -- die prinzipielle Verfügbarkeit einer solchen Technik natürlich vorausgesetzt.
MfG, at
-
-
Hi,
Was wäre wenn ich eine optionale JS-Abfrage einbaue, die je nach Tageszeit unterschiedliche Stylesheets benutzt und wenn JS deaktiviert ist, dass Standard-Sheet. Macht das Sinn oder ist das zu kompliziert?
Wenn es nur um das Hintergrundbild geht, dann setze, je nach Zeit, halt mit JS auch *nur* das Hintergrundbild! =;-)
Gruß, Cybaer
--
Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
-
-