jquery笔记 animate动画

语法1
.animate( properties ,[ duration ], [ easing ], [ complete ] )
.animate({
left: 50,
width: '50px'
opacity: 'show',
fontSize: "10em",
}, 500);

.animate({
fontSize: "5em"
}, 2000, function() {
alert("动画 fontSize执行完毕!");
});

.animate({
width: "toggle"
});

.animate({
width : "+=100px",
height : "+=100px"
});

===============================================
语法2
.animate( properties, options )

options参数
duration - 设置动画执行的时间
easing - 规定要使用的 easing 函数，过渡使用哪种缓动函数
step：规定每个动画的每一步完成之后要执行的函数
progress：每一次动画调用的时候会执行这个回调，就是一个进度的概念
complete：动画完成回调

step的fx返回的是和css相关的属性
progress的fx返回的是动画进度本身的属性

$('#elem').animate({
width: 'toggle',
height: 'toggle'
}, {
duration: 5000,
specialEasing: {
width: 'linear',
height: 'easeOutBounce'
},
complete: function() {
$(this).after('<div>Animation complete.</div>');
}
});

.animate({
height: '50'
}, {
duration :2000,
//每一个动画都会调用
step: function(now, fx) {
$aaron.text('高度的改变值:'+now)
}
})