CSS3 Transition在IE，Firefox，Opera和Safari中不起作用

Question

出於某種原因，我無法讓轉換工作。

當你在任何一節中操作時，應該有一個轉換。代碼在那裏，但它只能在Chrome中使用。

我做錯了什麼？

---

這只是不適用的過渡。

-webkit-transition-property: translateY, skew; 
-webkit-transition-duration: 0.5s, 0.5s; 
-webkit-transition-timing-function: ease-in-out, ease; 
-webkit-transition-delay: 0.02s; 
-moz-transition-property: translateY, skew; 
-moz-transition-duration: 0.5s, 0.5s; 
-moz-transition-timing-function: ease-in-out, ease; 
-moz-transition-delay: 0.02s; 
-ms-transition-property: translateY, skew; 
-ms-transition-duration: 0.5s, 0.5s; 
-ms-transition-timing-function: ease-in-out, ease; 
-ms-transition-delay: 0.02s; 
-o-transition-property: translateY, skew; 
-o-transition-duration: 0.5s, 0.5s; 
-o-transition-timing-function: ease-in-out, ease; 
-o-transition-delay: 0.02s; 
transition-property: translateY, skew; 
transition-duration: 0.5s, 0.5s; 
transition-timing-function: ease-in-out, ease; 
transition-delay: 0.02s; 
-webkit-transform: translateY(-210%) skew(60deg); 
-moz-transform: translateY(-210%) skew(60deg); 
-ms-transform: translateY(-210%) skew(60deg); 
-o-transform: translateY(-210%) skew(60deg); 
transform: translateY(-210%) skew(60deg); 

Answer 1

transition應該有它transform，而不是改造的各個組成部分。

請注意，目前唯一需要的供應商擴展是-webkit-transform。檢查http://caniuse.com/的兼容性。

Answer 2

您應該使用transform作爲轉換屬性。此外，你應該對前綴屬性和值：

-prefix-transition-property: -prefix-transform; 
transition-property: transform; 

此外，在本次檢查瀏覽器的支持：http://caniuse.com/#search=transition%7Ctransform根據所需瀏覽器支持，你可以滴一些前綴（最有可能的一切，除了-webkit-）。

演示：http://jsfiddle.net/RUbXu/1/