Grafik innerhalb einer Seite blättern

[gaplex]

Hallo,
wollte mal fragen wie man folgendes lösen könnte.

Ich habe eine Seite mit einer Grafik (ein aufgeschlagene Buch) von diesem Buch sind zwei Grafiken vorhanden. Zwischen diesen soll man "blättern" können. Die Grafik welche sich in einer mittig ausgerichteten box (div) in der Seite sitzt (darüber und darunter ist text) soll beim klick auf den Button "blättern" die nächste Grafik anzeigen, natürlich ohne dass dazu eine neue Seite geladen wird.
Ist das mit CSS möglich?

 

[Junny]

Per CSS das Aussehen der Seite zu verändern ist erstmal kein Problem. Der Knackpunkt ist hier, dass CSS das Klicken auf den Button nicht überprüfbar ist. Für Benutzerinteraktionen gibt es auch in CSS einige Pseudoklassen, die man in Selektoren verwenden kann, aber nichts in der Art: Button wurde eine gerade/ungerade Anzahl geklickt.
Was funktionieren würde, wäre dem Link (was Du als Button bezeichnest) selber den Hintergrund zu geben und dann entweder beim Überfahren mit der Maus durch

a.blaetterlink:hover {
  background-image: url(anderes_Bild.endung);
}

oder bei gedrückter linker Maustaste auf dem Link mit

a.blaetterlink:active {
  background-image: url(anderes_Bild.endung);
}

einen anderen Hintergrund zu geben.

Für Dein Vorhaben ist Javascript erforderlich, wobei für die User ohne Javascript ggf. eine andere Möglichkeit des Zugangs gegeben werden sollte.

Gruß
Junny