Script.Aculo.Us开发系列(一):起步

<script type="text/javascript" src="lib/prototype.js"></script>
<script type="text/javascript" src="lib/effects.js"></script>上面的代码直接加载effects.js, 程序运行的时候也不会出问题.再写一行js<script type="text/javascript">
function puff()
{
　　var oAnimation=new Effect.Puff("imgPuff");
}
Event.observe($('btnTest'),'click',puff);
</script>运行一下,一个非常酷的效果就出来了.注意所写的代码要在window.onload事件后才可以运行,否则会报错,原因很简单,只有在window.onload之后DOM才初始化.

这样类似的类还有Appear,Fade,BlindUp,BlindDown,SwitchOff,DropOut,Shake,SlideDown,SlideUp,Squish,Grow12种,这些动画在Script.Aculo.Us中叫做组合动画(Combine Effects),是相对于核心动画(Core Effects),CoreEffects在下篇中会由介绍.

使用参数

在每个类的构造函数中,第一个参数是应用效果的元素ID,第二个是一个Json对象,默认为Effect.DefaultOptions = {
　transition: Effect.Transitions.sinoidal,
　duration:　 1.0,　 // seconds
　fps:　　　　60.0,　// max. 60fps due to Effect.Queue implementation
　sync:　　　 false, // true for combining
　from:　　　 0.0,
　to:　　　　 1.0,
　delay:　　　0.0,
　queue:　　　'parallel'
}参数说明

transition:关于算法 Enum类型:sinoidal(默认),linear(线性),reverse(1-x函数),flicker,wobble,pulse,none,full ,这些参数其实都是一个关于pos的函数,返回值在0~1之间