IE10 CSS关键帧动画问题

时间:2015-09-28 10:09:45

标签: css3 svg internet-explorer-10

我已经创建了一个SVG加载指示器。它在Chrome等人工作正常,但我似乎无法在IE10中使用它 - 这里是小提琴:https://jsfiddle.net/288mu88o/

@keyframes loading {
    0% {
        fill: red;
    }
    100% {
        fill: yellow;
    }
}

.c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9, .c10, .c11, .c12, .c13, .c14, .c15 {
    animation: loading 1.5s infinite;
}

.c1 {
    animation-delay: 1.4s;
}
.c2 {
    animation-delay: 1.3s;
}
.c3 {
    animation-delay: 1.2s;
}

...

<g>
    <circle fill="#D9E2E7 " cx="294.7" cy="342.1" r="3.5" class="c1" />
</g>
<g>
    <circle fill="#D9E2E7 " cx="281.3" cy="344.8" r="3.5" class="c2"/>
</g>
<g>
    <circle fill="#D9E2E7 " cx="270.2" cy="352.7" r="3.5" class="c3"/>
</g>

...

我错过了什么?

感谢。

1 个答案:

答案 0 :(得分:0)

IE 10不支持SVG的CSS动画。您可以使用第三方解决方案,例如Fakesmile