HTML-Seite mit wöchentlichen Bildwechsel

[T-Rex]

Damit dir mal geholfen wird:

        <img id='main_img' src="/default_image.jpg" />
        <script>
            function getWeekNumber(d) {
                // Copy date so don't modify original
                d = new Date(Date.UTC(d.getFullYear(), d.getMonth(), d.getDate()));
                // Set to nearest Thursday: current date + 4 - current day number
                // Make Sunday's day number 7
                d.setUTCDate(d.getUTCDate() + 4 - (d.getUTCDay()||7));
                // Get first day of year
                var yearStart = new Date(Date.UTC(d.getUTCFullYear(),0,1));
                // Calculate full weeks to nearest Thursday
                var weekNo = Math.ceil(( ( (d - yearStart) / 86400000) + 1)/7);
                // Return array of year and week number
                return weekNo;
            }

            var result = getWeekNumber(new Date());
            document.getElementById("main_img").src = "/image_week_"+result+".jpg";
        </script>

<img ... /> bindet ein Bild ein. src ist die Bild source. Das heißt das ist der Pfad zum Bild. Kann auch eine komplette URL sein.

Das Script gibt die Wochennummer zurück. Die Logik dafür findest du in dem function block der mit } endet. Dort solltest du nichts ändern 😉. In var result steht die Kalenderwochennummer (heute 47).
Danach wird per getElementById das img gesucht und es wird eine neue source übergeben. Damit "überschreibst" du das aktuelle Bild.

Was musst du jetzt tun damit es bei dir funktioniert. Du musst bei dem img beim src erstmal einen passenden Pfad angeben für ein Bild das es auch physisch gibt (muss erreichbar sein). Bei getElementById("main_img").src = gibst du einen Pfad zu Bildern an, die es ebenfalls gibt. In meinem Fall muss es das Bild image_week_47.jpg (nächste Woche image_week_48.jpg) geben. Natürlich muss es auch Bilder für alle anderen 52 Wochen geben.

Meine Hilfe ist total rudimentär und stellt kein best prectice dar.

Gruß
worst prectice
T-Rex