Bild stündlich wechseln

Beitrag von **Hape** » So 24. Mai 2020, 00:10

Mit Hilfe eines kleinen JavaScripts ist es möglich, eine Grafik auf einer Webseite stündlich wechseln zu lassen. Einsatzmöglichkeiten für ein solches Script gäbe es mehrere. Sei es zu Designzwecken (beispielsweise ein Wandernder Mond bzw. eine wandernde Sonne je nach Tageszeit), oder zu Präsentationszwecken. Alles, was Sie dafür benötigen, sind insgesamt 24 Grafiken und das folgende JavaScript.

In den Header:

Code: Alles auswählen

<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>

Den Body-Tag erweitern:

Code: Alles auswählen

<body onload="BildAnzeigen();">

und dort wo es erscheinen soll dieses einfügen:

Code: Alles auswählen

<img id="Bild" src="grafik0.jpg">

Erläuterung:
Um 0:00 würde gemäß diesem JavaScript die Grafik mit dem Namen "grafik0.jpg" angezeigt werden. Um 12:00 würde dementsprechend die Grafik "grafik12.jpg" auf der Webseite angezeigt. Nach diesem Schema sollten Sie Ihre Grafiken benennen.

Demoseite dazu hier: Bildwechsel stündlich