css - 簡単なものなしのコンパスアニメーション

Question

無限回転でコンパス サス アニメーションを実行しようとしています。それは機能していますが、各ローテーションの終わりにアイテムの速度が少し遅くなるように見えますが (イージングのように)、自分で設定したイージングは​​なく、ドキュメントでは値が に設定されていfalseます。問題の原因は何ですか?

これは、コンパス animateで作成した私のアニメーションです。

@include keyframes(rotation) {
    0% {
        @include transform(rotate(0deg));
    }

    100% {
        @include transform(rotate(359deg));
    } 
}

Answer 1

animation-timing-functionCSS プロパティはデフォルトで に設定されease ています。これをオーバーライドしてアニメーションをスムーズにするには、このプロパティをlinearアニメーションを呼び出す場所に設定する必要があります。

animation-timing-function: linear;