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中不起作用

回答

相關問題