在IE或Opera中不起作用的CSS3動畫

我創建了一個簡單的動畫來使用webkit屬性和CSS3在網站上旋轉圖像。在IE或Opera中不起作用的CSS3動畫

這裏的樣式CSS（它applys只申報單）

.bg { 
    position: relative; 
    top: 0px; 
    left: 0px; 
    display:block; 
    -webkit-animation: spin 100s infinite linear; 
    -moz-animation: spin 100s infinite linear; 
    -o-animation: spin 100s infinite linear; 
    -ms-animation: spin 100s infinite linear; 
    opacity:0.8; 
    filter:alpha(opacity=80); /* For IE8 and earlier */ 
    z-index:-1; 
} 
@-webkit-keyframes spin { 
    0% { -webkit-transform: rotate(0deg);} 
    100% { -webkit-transform: rotate(360deg);} 
} 
@-moz-keyframes spin { 
    0% { -moz-transform: rotate(0deg);} 
    100% { -moz-transform: rotate(360deg);} 
} 
@-o-keyframes spin { 
    0% { -o-transform: rotate(0deg);} 
    100% { -o-transform: rotate(360deg);} 
} 
@-ms-keyframes spin { 
    0% { -ms-transform: rotate(0deg);} 
    100% { -ms-transform: rotate(360deg);} 
}

現在的結果是，在Mozilla Firefox，Chrome和Safari瀏覽器，它的工作原理沒有問題，但在Opera和Internet Explorer我不能看到任何動畫。

來源

2012-04-07 Antonio Colella

http://caniuse.com/#feat=css-animation

IE10和Opera 12的支持CSS動畫。不早。

來源

2012-04-07 12:54:16

嗨我正在使用最後一個Opera版本，根據測試下載 – 2012-04-07 12:55:51

Opera的最新穩定版本是11.62，並且您需要新版本的12版本來測試動畫（因爲它們僅在2周前實現 - http： //my.opera.com/desktopteam/blog/2012/03/26/html5-css-64bit）。警告：這個版本非常不穩定。我想你需要等待一個月左右。 – c69 2012-04-07 13:02:17

@AntonioColella我剛剛[已下載]（http://www.opera.com/browser/next/）和[測試]（http://jsfiddle.net/9pQgB/）Opera 12和關鍵幀動畫** **支持。 – 2012-04-07 13:02:47

也許這個信息將是有益的一些一誰與動畫的問題在Opera 12

在歌劇的12.x CSS動畫屬性「無限」並沒有爲我的作品。動畫只播放一次，然後停下來。但是，在我將持續時間（例如1秒）的整數值更改爲小數值（例如1.1秒）後，動畫開始播放無限。

來源

2014-05-06 12:28:32 pgasovav

在IE或Opera中不起作用的CSS3動畫

回答

相關問題