Skip to content

Instantly share code, notes, and snippets.

@Yanioconjota
Created January 12, 2017 19:23
Show Gist options
  • Save Yanioconjota/568ac5e84b71390af642c4c1ca0552d2 to your computer and use it in GitHub Desktop.
Save Yanioconjota/568ac5e84b71390af642c4c1ca0552d2 to your computer and use it in GitHub Desktop.
SASS:Transition Mixin
@mixin transition($transition-property, $transition-time, $method) {
-webkit-transition: $transition-property $transition-time $method;
-moz-transition: $transition-property $transition-time $method;
-ms-transition: $transition-property $transition-time $method;
-o-transition: $transition-property $transition-time $method;
transition: $transition-property $transition-time $method;
}
/* Usage - Stick into the top of your SCSS sheet and @include where needed for cross browser transitions.
.class {
@include transition($transition-property, $transition-time, $method);
}
$transition-property = the property you want to transition
$transition-time = seconds you want the transition to last
$method = how you want it to transition - e.g. ease-in-out
Usage example;
-------------
.item {
@include transition(padding, 1s, ease-in-out);
}
-------------
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment