Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@chasewoodford

chasewoodford/style.scss

Forked from saucer-jp/style.scss
Created June 16, 2012 02:12
Show Gist options
  • Star 6 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save chasewoodford/2939636 to your computer and use it in GitHub Desktop.
Save chasewoodford/2939636 to your computer and use it in GitHub Desktop.
Download ZIP
sass:mixin fadeIn
Raw
style.scss
$prefix:'-moz-', '-webkit-', '-o-', '-ms-', '';
// ********************
// fadeIn
// ********************
@mixin keyframe-fadeIn {
0% { opacity:0; }
100% { opacity:1; }
}
@-moz-keyframes fadeIn {
@include keyframe-fadeIn;
}
@-webkit-keyframes fadeIn {
@include keyframe-fadeIn;
}
@-o-keyframes fadeIn {
@include keyframe-fadeIn;
}
@-ms-keyframes fadeIn {
@include keyframe-fadeIn;
}
@keyframes fadeIn {
@include keyframe-fadeIn;
}
@mixin fadeIn( $arg ) {
$keyframe-name:fadeIn;
$duration:$arg;
@each $p in $prefix {
#{$p}animation:$keyframe-name $duration;
}
}
// e.g. @include fadeIn( 2s );
@akosbalogh
Copy link

great mixin :) thanks!

@Paul-Morris
Copy link

Nice

@noahmistry
Copy link

noahmistry commented Nov 26, 2018 •
edited

Thanks! Still useful as ever!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment