IE10 - CSS animation not working
The standard syntax is supported in Internet Explorer 10 with no need for the -ms
prefix on the keyframes declaration, nor on the animation-name
property. In fact, IE10, like the other vendor products, supports the shorthand animation
property alone as well:
@keyframes myanimation {
0% { color: black; }
80% { color: gold; transform: translate(20px,20px); }
100% { color: black; translate(0,0); }
}
#anim {
display: inline-block;
animation: myanimation 5s 5; /* use myanimation 5s duration, 5 times */
}
Fiddle: http://jsfiddle.net/ZfJ4Z/1/
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.
Help link I followed: http://msdn.microsoft.com/library/ie/hh673530.aspx
I've been told it'll be corrected.