Hallo,
ich habe vor mit Hilfe von Javascript und der normalen Einbindung von Bildern in html eine kleine Animation zu erstellen.
Im Grunde würde der Script zum Bilderwechseln der folgenden Seite beinahe ausreichen: http://www.web-toolbox.net/webtoolbox/bilder/image-swap.htm
Ich würde ihn jedoch gerne dahingehend umgestalten, dass von einem bestimmten Bild nur gezielt auf eine kleine Zahl anderer Bilder verlinkt weredn soll.
Konkret möchte ich 8 Bilder in eine Beziehung setzen, bei der jedes Bild auf 3 bestimmte andere Bilder verweisen soll. Jedes Bild wird nämlich durch 3 Eigenschaften charakterisiert. Bild AAA soll durch Bild AAB, ABA & BAA ausgetauscht werden. Wird nun Bild BAA angezeigt, soll wieder nur eine Eigenschaft verändert werden, so dass auf die Bilder AAA, BBA & BAB verwiesen werden kann.
Dabei sollen 3 Schaltfläche als Verweis jeweils eine Eigenschaft (die 1., 2. oder 3. Stelle) umschalten. Die 1. Schaltfläche schaltet beispielsweise Bild ABB in Bild BBB oder Bild BAB in AAB um. Die 2. würde zB. AAB in ABB oder BBB in BAB umschalten.
<head>
<script type="text/javascript" language="JavaScript">
// w. jansen web-toolbox.net
function swap(Bildname,BildURL)
{
document.images[Bildname].src = BildURL;
}
// </script>
</head>
<body>
<img name="bild01" src="imageAAA.jpg" width="82" height="120" border="1">
<a href="javascript:swap('bild01','BAA.png')">Schaltfläche 1: an/aus</a>
</body>
Der Script muss also so ergänzt werden, dass der unten stehende Link erkennt welches der 8 Bilder gerade angezeigt wird und gezielt auf das passende Bild verweist. Diesen Link dann für die 2 weiteren umschaltbaren Aspekte zu duplizieren triplizieren, sollte ich hinbekommen. Allerdings bin ich beim Erstellen der Abfrage welches Bild vorliegt und der gezielten Umschaltung überfordert.
Ich hoffe ich konnte mein Problem transparent machen und freue mich auf jegliche Anregungen.
Viele Grüße,
Michael