Backface-Visibility Animation

Backface Visibility useful when an element is rotated. If you want to hide backface value then you can use the hidden value.

In html file :

<h2>Backface-Visibility Animation</h2>
<div id="visibleDiv">
  <h1>Hello World !</h1>
</div>

In css file :

#visibleDiv {
  width: 100px;
  height: 100px;
  background: purple;
  color: white;
  -webkit-animation: mymove 5s infinite linear alternate;
  animation: mymove 5s infinite linear alternate;
}

@-webkit-keyframes mymove {
  to {-webkit-transform: rotateY(180deg);}
}

@keyframes mymove {
  to {transform: rotateY(180deg);}
}

output :