IE9中的@keyframes规则 [英] @keyframes rules in IE9

问题描述

我的 @keyframes 的动画在IE中不起作用。在网上各种消息来源说IE9支持它，有些人说它不受支持。是否有人确切知道我应该停止朝这个方向努力......如果没有，那么什么是 @ - ms-keyframes 我认为它是IE的前缀...谢谢！

My animation with @keyframes is not working in IE. On the net various sources say that it is supported in IE9 and some say that it is not supported. Does somebody know for sure so that I should stop working in that direction… And, if not, what is @-ms-keyframes I thought it is a prefix for IE… Thanks!

@-webkit-keyframes move {
  0% {left: 0px;}
  49% {left: 940px; opacity: 1;}
  50% {left: 940px; opacity: 0;}
  51% {left: -940px; opacity: 0;}
  52% {left: -940px; opacity: 1;}
  100% {left: 0px;}
}

@-webkit-keyframes backup {
  0% {left: -940px;}
  100% {left: 940px;}  

}  

@-moz-keyframes move {
  0% {left: 0px;}
  49% {left: 940px; opacity: 1;}
  50% {left: 940px; opacity: 0;}
  51% {left: -940px; opacity: 0;}
  52% {left: -940px; opacity: 1;}
  100% {left: 0px;}
}

@-moz-keyframes backup {
  0% {left: -940px;}
  100% {left: 940px;}  

}  

@-ms-keyframes move {
  0% {left: 0px;}
  49% {left: 940px; opacity: 1;}
  50% {left: 940px; opacity: 0;}
  51% {left: -940px; opacity: 0;}
  52% {left: -940px; opacity: 1;}
  100% {left: 0px;}
}

@-ms-keyframes backup {
  0% {left: -940px;}
  100% {left: 940px;}  

}  

推荐答案

或将robertc的评论放到答案中：从版本10开始，IE支持CSS3动画。如果您不确定浏览器支持，请查看caniuse.com - 该页面很少出错，因为这些表格基于来自浏览器开发人员的测试和信息。以下是css3-animation支持概述的链接： http://caniuse.com/#feat=css-动画

or to put robertc's comment into an answer: CSS3 animations are supported in IE starting with version 10 . If you are unsure about browser support, check out caniuse.com - the page rarely ever is wrong about this as the tables are based on tests and info coming from the browser-developers. Here's the link to the css3-animation support overview: http://caniuse.com/#feat=css-animation

对于IE9（和早期版本），您必须依赖JavaScript并接受动画无效。

for IE9 (and earlier versions) you have to rely on JavaScript and accept that animations wont work.

这篇关于IE9中的@keyframes规则的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！