Runs an animation once foward and then immediately after completion, runs the same animation in reverse.
Runs an animation once foward and then immediately after completion, runs the same animation in reverse.
.kf-mirror-example { $animation-map: ('div': ( margin-left: (0ms: 0, 1000ms: 100%))); @include kf-mirror($animation-map); }
.kf-mirror-example { height: 20px; width: 100%; position: relative; $size: 20px; div { position: absolute; left: 0; top: 0; background: #888888; width: $size; height: $size; border: 1px solid #e8e8e8; } }
<div class='kf-mirror-example'>
<div></div>
</div>