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.