Question

Assume that I have a div of a rectangular box that is red with white text on it. I want to make it so that when I click on it, it animates with rotation in a 3D way (using CSS3?) and shows different text on it. (i.e. kind of like if you were looking at a flashcard with the letter “A” on it, and flipping it over to see the letter “B” on the other side).

How do I accomplish this with javascript/css3?

Answer 1

http://css3playground.com/flip-card.php

You are looking for the following CSS3 properties (right-click on one of the flashcards):

-moz/webkit-transition(-style): ...;
-moz/webkit-transform: ...;