Grafik stündlich wechseln lassen

Mit Hilfe eines kleinen JavaScripts ist es möglich, dass du auf deiner Website eine Grafik stündlich wechseln lassen kannst. Es gibt dabei viele Möglichkeiten, wie du so etwas einsetzen könntest. Du könntest bspw. das Script dazu benutzen, das Design deiner Website aufzupeppen. So wäre es möglich, einen Mond oder eine Sonne je nach Tageszeit wandern zu lassen.

Alles, was du dafür benötigst, sind insgesamt 24 Grafiken und das folgende JavaScript.

 

Mit JavaScript eine Grafik stündlich wechseln lassen

Mit dem nachstehenden JavaScript kannst du auf deiner Website die Grafik stündlich wechseln lassen.

Es gibt dabei mehrere Teile, die du dazu in deine Website einbauen musst. Zunächst natürlich das Script an sich. Dies kommt dabei in den Header des HTML Dokuments. Weiterhin musst du das Script beim Laden der Seite ausführen lassen. Dies geschieht über den Befehl body onload. Danach musst du noch definieren, wo das Bild auf der Website erscheinen soll.

Das folgende Beispiel zeigt dabei eine Möglichkeit, wie du das Script in deine Website einbauen kannst.

 

Beispiel:

<html>
 <head>
 <script language="JavaScript">
 <!--
 
 var Dateiname = "grafik";
 var Dateiendung = ".jpg";
 
 function BildAnzeigen()
 {
     var Datum = new Date();
     var Stunde = Datum.getHours();
 
     document.getElementById("Bild").src = Dateiname+Stunde+Dateiendung;
 }
 
 //-->
 </script>
 <title>Grafik stündlich wechseln lassen</title>
 </head>
 <body onload="BildAnzeigen();">
 
 <img id="Bild" src="grafik0.jpg">
 
 </body>
 </html>

 

Erklärung:

Um 0:00 Uhr zeigt dieses JavaScript dementsprechend die Grafik mit dem Namen grafik0.jpg an. Um 12:00 Uhr zeigt es hingegen die Grafik grafik12.jpg auf der Website an. Nach diesem Schema solltest du also deine Grafiken benennen.

 


Dir gefällt dieser Artikel?

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.