Skip to content

Instantly share code, notes, and snippets.

@joecritch
Created February 2, 2012 15:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save joecritch/1723939 to your computer and use it in GitHub Desktop.
Save joecritch/1723939 to your computer and use it in GitHub Desktop.
.transition (@property: all, @duration: 0.6s, @delay: 0s) {
-webkit-transition: @property @duration ease @delay;
-moz-transition: @property @duration ease @delay;
-ms-transition: @property @duration ease @delay;
-o-transition: @property @duration ease @delay;
transition: @property @duration ease @delay;
}
/* Long-hand for overriding properties */
.transition-property (@property) {
-webkit-transition-property: @property;
-moz-transition-property: @property;
-ms-transition-property: @property;
-o-transition-property: @property;
transition-property: @property;
}
/* This allows me to then create an extremely succinct instantiation for a new transition with multiple properties, like so: */
.box {
.transition;
.transition-property(~'margin, padding, width');
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment