HTML/CSS/JavaScript - Eine Animation ohne Flash

[obiwan1973]

Hallo zusammen,

ich hätte da eine knifflige Aufgabe - eine Animation mit Bordmitteln: HTML/CSS/JavaScript - ohne Flash.

Die Ist-Situation:
Ich habe eine Tabellenzelle (td-Tag).

Diese hat als Hintergrund (mit einmaliger Darstellung, also nicht gekachelt) ein Foto der Größe XY.

Nun möchte ich dieses Hintergrundfoto ohne Neuladen der Seite immer wieder wechseln, im 3-Sekunden-Rhytmus, das Ganze dann rotierend, d.h. nach dem fünften Bild kommt wieder das erste. Alle Bilder haben dieselbe Größe XY, alle dasselbe Format (PNG).

Mein Ziel, oder besser mein Plan:

Beim Laden der Seite hole ich mir alle 5 Bilder vom Server. Und dann starte ich eine JavaScript-Funktion, die die Hintergrundbilder rotieren lässt.
Das mit dem zeitlichen Rotieren bekomme ich hin.

Ich möchte aber nicht, dass die Bilder immer wieder vom Server geholt werden, deswegen die Idee, die Bilder in einem Stoß zu Beginn zu holen.

Das Wechseln des Hintergrundbildes dürfte mit JS laufen, indem ich die CSS-Eigenschaft des td-Tags ändere, irgendwie mit

td_diashow.style.background = ...

Aber wie sage ich dem JS, dass es auf Daten zugreifen soll, die bereits auf der Festplatte sind?

Und überhaupt:
Wie speichere ich am besten die Bilddaten beim Laden der Seite?
Als fünf <img>-Tags ???

Und dann müsste ich irgendwie sagen

td_diashow.style.background = img_02.src;

Aber dann holt er sich vermutlich das Bild erneut vom Server, oder?

Wie sage ich ihm, dass die Bilddaten bereits auf der Festplatte sind, in den <img>-Tags? Das muss doch mit CSS und JS irgendwie gehen.

Gruß und ein schönes WE!

Thomas