CSS3关键帧在safari中中断

Question

我有一个加载微调器的代码，它适用于所有浏览器，除了safari，它打破整个网站，我已经缩小到问题是下面的webkit特定代码，但无法弄清楚它为什么刹车，有任何想法吗：

@-webkit-keyframes spin{ 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); }; }

@-webkit-keyframes spinoff{ 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(-360deg); }; }

Answer 1

在代码中100%定义后，您有不必要的分号。 显然，Safari会对其进行扼流，而其他人则忽视它。

@-webkit-keyframes spin{ 
    0% { -webkit-transform: rotate(0deg); } 
    100% { -webkit-transform: rotate(360deg); }
}

@-webkit-keyframes spinoff{ 
    0% { -webkit-transform: rotate(0deg); } 
    100% { -webkit-transform: rotate(-360deg); } 
}