jQuery 使得通过$.fn.animate方法设置CSS属性控制动画成为可能。
$.fn.animate 这个方法允许你设置一个值,或者使用默认值。
Example 6.6. 使用$.fn.animate自定义效果
$('div.funtimes').animate(
{
left : "+=50",
opacity : 0.25
},
300, // 持续时间
function() { console.log('done!'); // 回调
});
颜色相关的属性是不能通过$.fn.animate用在jQuery以外的。color
plugin可以很轻松完成颜色动画。我们将在书的后面章节讨论如何使用此插件。
[Definition: Easing Easing描述:出现在其中一个效果 - 无论是变化或是稳定的,或动画进行中在不同点位的速度。 ]jQuery包括两个easing缓冲方法:"linear" 和 "swing"。如果你想在你的动画更加自然的过渡,各种easing插件就可以用上。
在jQuery 1.4 版本中,我们使用$.fn.animate方法能容易的设置 per-property 。
Example 6.7. easing属性
$('div.funtimes').animate(
{
left : [ "+=50", "swing ],
opacity : [ 0.25, "linear" ]
},
300
);
关于easing选项的更多细节,请参见 http://api.jquery.com/animate/.
Copyright Rebecca Murphey, released under the Creative Commons Attribution-Share Alike 3.0 United States license.