Skip to content

Instantly share code, notes, and snippets.

@lewisnyman
Created May 24, 2012 15:10
Show Gist options
  • Save lewisnyman/2782134 to your computer and use it in GitHub Desktop.
Save lewisnyman/2782134 to your computer and use it in GitHub Desktop.
Recreating the jQuery animation speed syntax for CSS animations using LESS
.animation-duration(@time) {
-webkit-animation-duration: @time;
-moz-animation-duration: @time;
-ms-animation-duration: @time;
-o-animation-duration: @time;
animation-duration: @time;
}
.animation-duration(@time) when (@time = fast) {
-webkit-animation-duration: 0.25s;
-moz-animation-duration: 0.25s;
-ms-animation-duration: 0.25s;
-o-animation-duration: 0.25s;
animation-duration: 0.25s;
}
.animation-duration(@time) when (@time = normal) {
-webkit-animation-duration: 0.5s;
-moz-animation-duration: 0.5s;
-ms-animation-duration: 0.5s;
-o-animation-duration: 0.5s;
animation-duration: 0.5s;
}
.animation-duration(@time) when (@time = slow) {
-webkit-animation-duration: 1s;
-moz-animation-duration: 1s;
-ms-animation-duration: 1s;
-o-animation-duration: 1s;
animation-duration: 1s;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment