September 2, 2015
Sass Animation Delays
Here’s a quick and easy way to delay animations between elements by using a Sass @for
loop.
.dot {
animation: bob 1s ease infinite;
@for $i from 1 through 4 {
&:nth-child(#{$i}) {
animation-delay: $i * 0.1s;
}
}
}
Google Dots Example
See the Pen 3988b1d2afcfb1f6d0a0cb1a394b9b5e by Ryan McLaughlin (@ryanmclaughlin) on CodePen.