CSS 3动画效果在IE中不起作用

我试图将这个漂亮的动画效果列表从 Liffect - Effect for Lists包含到我的ASP.NET应用程序中。CSS 3动画效果在IE中不起作用

<form id="form1" runat="server"> 
    <div> 
     <ul effects="pageTop"> 
      <li> 
       <img src="Images/1.jpeg" alt="Car" /></li> 
      <li> 
       <img src="Images/2.jpeg" alt="Car" /></li> 
      <li> 
       <img src="Images/3.jpeg" alt="Car" /></li> 
     </ul> 
    </div> 
    <script type="text/javascript">    
     $(document).ready(function() { 
      $("ul[effects] li").each(function (i) { 
       $(this).attr("style", "-webkit-animation-delay:" + i * 300 + "ms;" 
         + "-moz-animation-delay:" + i * 300 + "ms;" 
         + "-o-animation-delay:" + i * 300 + "ms;" 
         + "animation-delay:" + i * 300 + "ms;"); 
       if (i == $("ul[effects] li").size() - 1) { 
        $("ul[effects]").addClass("play") 
       } 
      }); 
     }); 
    </script> 
</form>

在这里您可以找到JS Fiddler。

挣扎几个小时后，我刚刚注意到，这是在Firefox 16.x而不是在IE 9。这似乎是某种CSS 3的问题，但不确定它究竟在哪里出错。请帮助使其完全跨浏览器兼容（IE，Firefox，Chrome等）

我还希望你让我知道了跨浏览器兼容CSS 3黑客为HTML 5一些很好的资源。

来源

2012-11-07 Furqan Safdar

你想支持哪些版本的IE吗？ – jfrej

对不起忘了提及它的IE 9.更新了我的问题。 –

http://caniuse.com/#search=css3%20animation –

在IE8及以下版本中，您不会对CSS3有任何支持。检查this nice reference以查看您想使用的主要浏览器是否可用。

编辑你的上一次更新：动画是不是在IE9

支持

来源

2012-11-07 10:16:34

IE9支持动画，我使用的参考是在IE9中工作，但是当我尝试在ASP.Net中使用它或JSFiddler它不起作用。看到我编辑的问题。 –

如果您正在使用某些人物提琴，请在左栏查看额外的脚本或资源。最有可能的代码是使用一个库来添加对IE9的支持，因为它默认没有它。 –

你曾经使用过的CSS是IE3和IE8将不支持css3属性。

来源

2012-11-07 10:15:11 Gopikrishna

但我使用IE9 –

最好的，你看看这对于CSS3动画使用jQuery回退： http://msdn.microsoft.com/en-us/magazine/hh304380.aspx

而且还http://modernizr.com/为“跨浏览器兼容CSS 3 HTML 5的黑客“

来源

2012-11-07 10:19:41 Andy

CSS 3动画效果在IE中不起作用

回答

相关问题