Skip to content

Instantly share code, notes, and snippets.

@zizu-kun
Created September 23, 2016 12:32
Show Gist options
  • Select an option

  • Save zizu-kun/a8d868ac6b59f739817061820fb15159 to your computer and use it in GitHub Desktop.

Select an option

Save zizu-kun/a8d868ac6b59f739817061820fb15159 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