IE10 - CSS 动画不起作用 [英] IE10 - CSS animation not working
问题描述
我有一个缩放动画,它在 IE10 中工作了大约一天,然后停止了.我没有做任何改变,也不知道会发生什么破坏它.
I have a scale animation that worked in IE10 for about a day and then stopped. I didn't make any changes and am not sure what would happen to break it.
有人有什么想法吗?当我查看 IE 开发工具时,它没有选择动画名称,而是选择所有其他属性.
Does anyone have any ideas? When I look in the IE dev tools it's not picking up the animation name, but is picking up all the other properties.
这是CSS:
@-ms-keyframes move97
{
0% {
transform:scale(1,1);
-ms-transform:scale(1,1);
-moz-transform:scale(1,1);
-webkit-transform:scale(1,1);
-o-transform:scale(1,1);
}
50% {
transform:scale(0.97,0.97);
-ms-transform:scale(0.97,0.97);
-moz-transform:scale(0.97,0.97);
-webkit-transform:scale(0.97,0.97);
-o-transform:scale(0.97,0.97);
}
100% {
transform:scale(1,1);
-ms-transform:scale(1,1);
-moz-transform:scale(1,1);
-webkit-transform:scale(1,1);
-o-transform:scale(1,1);
}
}
.press97
{
-ms-animation-name: move97 0.2s; /* note MS has this different.... ugh */
animation: move97 0.2s;
-moz-animation: move97 0.2s; /* Firefox */
-webkit-animation: move97 0.2s; /* Safari and Chrome */
animation-timing-function: linear;
-moz-animation-timing-function: linear;
-webkit-animation-timing-function: linear;
-ms-animation-timing-function: linear;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-ms-animation-fill-mode: forwards;
}
推荐答案
显然我所关注的帮助链接不正确.当我将其更改为 -ms-animation: move97 0.2s 时,它可以工作.这是我最初拥有的,但它不起作用,所以我将其更改为上面显示的内容,确实如此.
Apparently the help link I was following isn't correct. When I change it to -ms-animation: move97 0.2s, it works. This is what I had originally and it did NOT work, so I changed it to what's shown above, which did.
我关注的帮助链接:http://msdn.microsoft.com/library/ie/hh673530.aspx
我被告知它会得到纠正.
I've been told it'll be corrected.
这篇关于IE10 - CSS 动画不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!