Jump to content
Sign in to follow this  
falkos

Tabellenhintergrund Tageszeitabhängig

Recommended Posts

Ich möchte gerne auf meiner HP einen Tabellenhintergrund Tageszeitgesteuert wechseln lassen.

Tagbild

Nachtbild


Alle versuche die ich bis jetzt gestartet habe sind gescheitert. kann mir von euch jemand weiterhelfen ?

Share this post


Link to post
Share on other sites

Also grob gesagt:


Du kannst mit time() die aktuelle Zeit auswerten. Ich würde, jenach dem welche Stunde ist am Tag, der Tabelle einfach da per php zwei Klassen geben.


Tag: .....

Nacht: ....


Und den rest per CSS machen.

Share this post


Link to post
Share on other sites

Das ist Javascript, was du gepostet hast. Bei PHP haste sowas wie [/code]


So. Mit dem time () holen wir uns die aktuelle "Zeit" und das date ( 'H' nimmt sich daraus die aktuelle Stunde. Alles klar was nun in $aktuelle_stunde drin steht? Genau! Eine Zahl zwischen 0 und 23.


Nun gehst du an die Stelle in deinem Dokument wo du das Design setzt, also z.b. den background:

 




Hier baust du nun die $aktuelle_stunde ein. Eine Möglichkeit wäre:


= 21 AND $aktuelle_stunde ">

 

Am Ende sollte z.B. bei 23 Uhr folgendes im HTML-Code stehen:

 

 ... 

 


Viele Grüße

Share this post


Link to post
Share on other sites

Wenn er es nun aber gern mit JS machen will, warum auch nicht.

Der Fehler liegt da im document.write(). Damit kannst du zwar was kritzln lassen, was sich aber, wie du gemrekt hast, ganz schlecht vom Browser interpretieren lässte.


Um das nun zu lösen gibt es mehrere Ansätze. Ich bevorzuge den janz, janz einfachen.


Irgendwo gibts 2 CSS-Klassen. Eine für Tag (d), eine für Nacht (n). Dann kommt irgendwo im Dokument deine Tabelle, mit der ID (abc).

Und nun ist es vollkommen wursch, hauptsache ist, NACH der Tabelle, ein JS, welches der Tabelle die entsprechende Klasse zuweist.


Ähm und .. Sinnfrei ? Wie kann was größer 21 sein und gleichzeitig kleiner 7?

*hihi* @Kooni hätte dir aber auch auffallen sollen.. das kommt vom C&P


Aber hier mal zum nachgucken, ohne logischem Fehler :-D



.d{
background-color:#ff0000;
/* musst natürlich den Pfad zum Bild noch anpassen*/
background-image: url(1.jpg);
}
.n{
background-color:#00ffff;
/* musst natürlich den Pfad zum Bild noch anpassen*/
background-image: url(2.jpg);
}





		a = new Date();
		document.write(a.getHours() + ':'+a.getMinutes()+ ' Uhr');




var d = new Date();
if(d.getHours()>=21 || (d.getHours() >= 0 && d.getHours() 


Share this post


Link to post
Share on other sites
Guest
You are commenting as a guest. If you have an account, please sign in.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

×