CSS 3转换动画在IE 11中不适用于动态创建的元素 [英] Css3 transform animation doesn't work in IE 11 for a dynamically created element

问题描述

我已经将CSS3转换动画应用于动态创建的元素，并且它可以在Safari，firefox和chrome中使用，但不适用于IE。我已经检查了代码和CSS。

I have applied CSS3 transform animation to a dynamically created element and it works in Safari,firefox and chrome but not in IE.I have checked the code and css. there is nothing wrong with them.

在IE inspector（开发人员工具）中，动画属性用红色下划线标出。不知道这有什么问题。有人可以帮忙吗？。

In IE inspector(Developer tools) animation properties are underlined in red.Don't know what is wrong with this. can someone please help?.

我的CSS

.loadNew {

  -webkit-animation-name: rotate;
  -webkit-animation-duration: 1s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;

  -moz-animation-name: rotate;
  -moz-animation-duration: 1s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;

  -o-animation-name: rotate;
  -o-animation-duration: 1s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;


  /* below animation properties are underlined in red in IE inspector */
  animation-name: rotate;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;

}

@-webkit-keyframes rotate {

  from {
     -webkit-transform: rotate(0deg);
  }

  to {
     -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes rotate {

  from {
    -moz-transform: rotate(0deg);
  }

  to {
    -moz-transform: rotate(360deg);
  }
}

@-o-keyframes rotate {

  from {
    -o-transform: rotate(0deg);
  }

  to {
    -o-transform: rotate(360deg);
  }
}

@keyframes rotate {

 from {
   transform: rotate(0deg);
 }

 to {
   transform: rotate(360deg);
 }
}     

推荐答案

，最后我找到了它在IE中不起作用的原因。我放置了一个元标记，并将其更改为
以下。

Well, finally I found the reason why it didn't work in IE. I have placed a meta tag and I changed it as belows.

之前

 <meta http-equiv="X-UA-Compatible" content="IE=9,chrome=1"/>

之后

 <meta http-equiv="X-UA-Compatible" content="IE=9;IE=10;IE=Edge,chrome=1"/>

感谢小孩子快速响应

加油（是）

Thanks wiz kid for your quick responce
cheers (Y)

这篇关于CSS 3转换动画在IE 11中不适用于动态创建的元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！