Card Flip Effect with pure CSS3
Card Flip Effect
You will love CSS animations. CSS animations are fun. Here are some more CSS Experiments for you. We will create CSS Flip card effect. This is a 3D flipping card.
Here is the example and the explanation to the full tutorial:
Make a div and name it as card. It has some basic styles like below.
So we have our card. Just put a hover state and for hover state just transform the card and rotate on Y axis. Add a transition effect.It will make the animation smooth. Tell the card to preserve the 3D and for this we will use transform-style. It will give you the illusion.
Originally published at www.voltspecter.com.