使用jQuery / Javascript编辑CSS3动画

时间:2012-06-01 16:33:05

标签: javascript jquery animation css3

是否可以像这样编辑动画

@-webkit-keyframes rotation {
  0%   { -webkit-transform: rotate(0deg); }
  85% { -webkit-transform: rotate(1442deg); }
  94% { -webkit-transform: rotate(1438deg); }
  100% { -webkit-transform: rotate(1440deg); }
}

使用JavaScript?

提前谢谢你,

利玛

1 个答案:

答案 0 :(得分:0)

最简单的方法应该是jQueryKeyframes插件: https://github.com/jQueryKeyframes/jQuery.Keyframes

它为您提供了一个简单的语法,因此您的示例应如下所示:

$.keyframe.define([{
    name: 'rotation',
    0%   { 'transform': 'rotate(0deg)' },
    85% { 'transform': 'rotate(1442deg)' },
    94% { 'transform': 'rotate(1438deg)' },
    100% { 'transform': 'rotate(1440deg)' }
}]);

通过JS注入CSS的手动方式也应该有效。