dojo1.7翻译 动画效果(Animations)
原文地址：http://dojotoolkit.org/documentation/tutorials/1.7/animation/
难度：初级
版本：1.7
?
最终的完成效果
?
?
开始像所有的图形用户界面一样，Web用户界面，也是利用像素来描绘真实世界的影像，我们可以操纵像素让其快速变化而让人认为其正在运动中。通过变化的时间控制，可以使动画显示的更直观的，运动表现的更平滑。
?
在本教程中，我们将学习Dojo提供的动画工具，允许你调整和建立自定义动画，以满足您的特定的用户界面要求
?
?
?
回顾效果功能在以前的教程中，我们已经讨论过一些常用的内置效果功能。 我们可以使用的方法有dojo/_base/fx模块中的baseFx.fadeIn和baseFx.fadeOut方法，dojo/fx模块中的fx.slideTo和fx.wipeIn方法。我们已经了解了如何可以传递一个参数对象来控制我们想要的动画：
?
// Set up a click handlers to run our animationson(swapButton, "click", function(evt){ // chain the swap nodes animation // with another to fade out a background color in our container var anim = fx.chain([ swapAnim(c1, c2), baseFx.animateProperty({ node: container, properties: { backgroundColor: "#fff" } }), ]); // before the animation begins, set initial container background aspect.before(anim, "beforeBegin", function(){ domStyle.set(container, "backgroundColor", "#eee"); }); // when the animation ends, toggle the originalOrder on(anim, "End", function(n1, n2){ originalOrder = !originalOrder; }); anim.play();});??
上面是调用代码。 数组传递给fx.combine之前，fx.chain有两个单独的动画。我们要运行这些系列：交换节点，然后背景色动画。 容器的初始背景颜色设置连接的beforeBegin事件，并在onEnd我们有一个处理，以确保当我们点击下一步，节点被扭转。
?
运行示例
?
生成的代码是灵活的，其逻辑很容易地扩展。
?
结论Dojo的动画方便简??单，但所有的控制，你需要具体的定制过渡和其它效果。动画可以从简单的一小片开始建立，并提供有用的生命周期事件，以帮助更改同步功能。 在现实世界中，没有直接从一个状态马上变成另一个状态，控制运动和视觉的变化，可以创造非常好的用户体验。
?