为什么CSS动画在Chrome中运行顺畅,但在Firefox中却没有?

时间:2013-04-22 01:29:00

标签: css google-chrome css3 firefox

为什么CSS动画在Chrome中运行顺畅但在Firefox中没有?

url:http://carloshermoso.com/works/rwd/

#mainContent h2 { -moz-animation-duration:3s; -moz-animation-name:slideIn; -webkit-animation-duration:3s; -webkit-animation-name:slideIn; text-transform:uppercase; }
@-moz-keyframes slideIn
{
from { margin-bottom:100%; width:300%; }
to { margin-top:0%; width:100%; }
}
@-webkit-keyframes slideIn
{
from { margin-bottom:100%; width:300%; }
to { margin-top:0%; width:100%; }
}

万分感谢!

1 个答案:

答案 0 :(得分:1)

可能只是因为chrome和firefox的渲染引擎不同。如果您想了解如何提高css转换速度,可以查看this。 此外,您的代码在Opera或Internet Explorer中不起作用,因为您没有包含Opera和IE 10使用的普通(无前缀)animation属性。请注意,IE 9及以下版本根本不支持CSS动画。有关here的更多信息。