指南针动画混合多个动画

Question

我正在尝试将 Compass 动画混合与多个动画一起使用。这可能吗？

我尝试了@include animation(an-1 5s infinite, an-2 10s infinite)，但我收到了一个错误：Mixin animation takes 1 argument but 2 were passed。

Answer 1

您的指南针语法是正确的，并且适用于当前版本的指南针。在以前的版本中可能不是这种情况。

Demo on Codepen

尽管您始终可以将两个动画合并为一个（如果两个动画应该使用完全相同的选项，例如缓动）：

@include animation(an-3 5s ease-in infinite);

@include keyframes(an-3) {
    from {
      transform: scaleY(0);
      opacity: 0;
    }
    to {
      transform: scaleY(1);
      opacity: 1;
    }
}