Johannes Scharrer Realschule
91217 Hersbruck

Pompeji

6. Therme

Wenn man mit der Maus auf ein Bild geht, soll ein neues Bild erscheinen. Normalerweise löst man dies mit den Javascript-Befehlen onmouseover und onmouseout. Damit es beim Laden des Bildes nicht zu einer kurzen Pause/Flackern kommt, kann ein weiteres Javascript die Bilder vorher laden.
In css wird einfach nur die Klasse .rollover mit der Pseudoklasse :hover definiert. Die beiden Bilder werden zusammengefügt und durch das Bewegen der Maus wird die vorher sichtbare obere Hälfte nach oben geschoben und die untere Hälfte sichtbar: