CSS 动画在 Mozilla 中不起作用

Question

谁能看出我做错了什么？我试图让我的动画 css 在 Firefox 中工作，但不知何故，它仍然无法工作。

                    .animatietekst {
                        -webkit-animation: scaling 1s 10 ease;
                        -webkit-animation-iteration-count: infinite;
                        -webkit-animation-direction: alternate;
                        -moz-animation: scaling 1s 10 ease;
                        -moz-animation-iteration-count: infinite;
                        -moz-animation-direction: alternate;
                    }

                    @-webkit-keyframes scaling {
    from {
        -webkit-transform: scale(0.96);
    }
    to {
        -webkit-transform: scale(1);
    }
}

                    @-moz-keyframes scaling {
    from {
        -webkit-transform: scale(0.96);
    }
    to {
        -webkit-transform: scale(1);
    }
}

Answer 1

Firefox 无法识别webkit 转换

@-moz-keyframes scaling {
        from {
            -moz-transform: scale(0.96);
        }
        to {
            -moz-transform: scale(1);
        }
    }

无论如何您都不再需要 moz 前缀

@keyframes scaling {
        from {
            transform: scale(0.96);
        }
        to {
           transform: scale(1);
        }
    }

将与

一起正常工作

   .animatietekst {
     -webkit-animation: scaling 1s 10 ease;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
     animation: scaling 1s 10 ease;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    }

CSS 动画在 Mozilla 中不起作用

CSS animation doesn't work in Mozilla

css

firefox

animation

mozilla