爲什麼這個簡單的CSS動畫不起作用？

Question

我創建了一個JSFiddle來顯示我的問題。

http://jsfiddle.net/sqMT6/1/

當你點擊一個段落中，「隱藏」類設置，所以WebKit的動畫應該播放，該款應在5秒鐘內消失。

設置了課程，並且不播放動畫。

我一定錯過了一件非常簡單的事情。

任何人都可以請指出嗎？

謝謝

Answer 1

嘗試從/到@keyframe規則中的屬性之前刪除冒號。

原始CSS

@-webkit-keyframes appear{ 
    from:{opacity: 0;} 
    to: {opacity: 1;} 
} 

@-webkit-keyframes disappear{ 
    from:{opacity: 1;} 
    to: {opacity: 0;} 
}​ 

固定CSS

@-webkit-keyframes appear{ 
    from {opacity: 0;} 
    to {opacity: 1;} 
} 

@-webkit-keyframes disappear{ 
    from {opacity: 1;} 
    to {opacity: 0;} 
}​ 

例子：http://jsfiddle.net/sqMT6/3/