zur Seite Thema Transform backface-visibity
Bei beiden Elementen ist die Rückseite ausgeblendet. Das zweite Element wird schon zu Beginn um 180 Grad gedreht, deshalb ist es beim Start nicht sichtbar. Berührt man das umgebende div, werden beide Elemente um 180 Grad weiter gedreht, so dass das zweite sichtbar wird, und das erste unsichtbar.
Beide divs wurden mit position absolute übereinander gelegt. Dadurch entsteht der Effekt einer Vorderseite und Rückseite. Da beide Bilder mit position absolute versehen wurden, erkennt das Elternelement diese nicht mehr und hat somit keine Breite und Höhe mehr. Daher muss man diese mit CSS zuweisen.