( jQuery.cssNumber[ prop ] ? "" : "px" );
},
...}
ok！你应该有个大致的轮廓了，让我详细讲解下参数的意义吧~~
fx| 属性 | 类型 | 值 |
| easing | 字符串 | 动画方式"linear",swing,easeIn,easeOut...等 |
| elem | DOM元素 | 正在动画的元素 |
| end | 数值 | 动画结束值 |
| now | 数值 | 动画当前值 |
| options | 对象 | 参数 |
| options.duration | 数值 | 传到动画动的duration |
| options.queue | 字符串 | 动画队列 |
| pos | 数值 | 在动画过程中从0.0到1.0 |
| prop | 字符串 | 正在变化的css属性 |
| start | 数值 | CSS属性开始变化的值 |
| unit | 字符串 | CSS值的单位 |
知道这些，我们可以做很多事！
jQuery Animation实现css3动画 ：
jQuery Animation的工作原理是通过将元素的css样式从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创建动画效果。只有数字值可创建动画（比如 “margin:30px”）。字符串值无法创建动画（比如 “background-color:red”）。
像CSS3好多效果因为不是数值的，所以是没有办法直接通过animate()方法实现的。如translate(), rotate(), scale(), skew(), matrix(), rotateX(), rotateY()等方法，这些方法的一个特点就是它们的值是字符和数字混合在一起的。因此我们是不可以直接用animate()方法来动态地修改它们的值来实现动画的效果。
如果我们自己用Javascript实现CSS3动画，那么我们只能自已通过setInterval()方法来实现，实现起来比较复杂。其实animate()方法就是基于setInterval()方法进行工作的，但是可以用方便的设置动画速度，还可以设置是匀速还是变速。animate()方法的第二种用法有个stp参数规定动画的每一步要执行的函数。我们可以用使用一个不影响元素效果显著的CSS值来触发animate()方法，然后在step回调函数中修改我们想要修改的值，这样就可以间接地实现动画了。
CSS代码：
#box {
width:100px;
height:100px;
position:absolute;
top:100px;
left:100px;
text-indent: 90px;
background-color:red;
}Html代码：
<p id="box"></p>Javascript代码：
var s=0;
$('#box').animate({ textIndent: 0 }, { //这里的now参数即前面设置的数值，即textIndent: 0中的0，然后后面还有，则以后面的数值为准。
duration:2000,
step: function(now,fx) {
s++;
fx.start=45;//你可以尝试修改start,end值，来看rotate的变化
fx.end=0;
if(s==1) console.log(fx.start+"----"+fx.end+"---"+fx.startTime);
$(this).css('-webkit-transform','rotate('+now+'deg)');
}
});这里使用text-indent属性来触发动画，是因为我们这里没有文字，所以使用text-indent而不会影响到元素的样式效果，这里也可以用font-size等。然后使用animate()方法产生的节奏来实现动画。
以上就是jQuery之深入学习Animate（二）的详细内容，更多请关注php中文网其它相关文章！
网站建设是一个广义的术语，涵盖了许多不同的技能和学科中所使用的生产和维护的网站。
关键词：jQuery之深入学习Animate（二）