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>

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 :

Submit a Comment

Your email address will not be published. Required fields are marked *


Select Categories