Skip to content

Instantly share code, notes, and snippets.

@siriokun
Created March 1, 2013 10:47
Show Gist options
  • Save siriokun/5063876 to your computer and use it in GitHub Desktop.
Save siriokun/5063876 to your computer and use it in GitHub Desktop.
Better CSS Animation with Translate3D to trigger hardware CPU acceleration
.target {
height: 0;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.target.open {
height: 100%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment