Question

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

@-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;}  

}

Answer 1

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

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

IE9中的@keyframes规则

1 个答案: