scriptaculous 包含以下几个部分：

builder.js ：提供了一种方便的建立html元素的方法
controls.js ：包含自动提示和动态编辑两个控件
dragdrop.js ： 提供元素拖放的功能
effects.js ： 设计优良的ajax效果库，这篇文章要讲的就是这个
slider.js ： 一个滑动条控件

现在又新增了一个：sound.js 可以播放音频文件以及获取播放列表！

关于每个部分的使用方法建议查看scriptaculous 的官方文档?，这篇文章只讲scriptaculous中的effect.js（动画效果库）这一部分

effects.js中提供了两种类型的动画效果，一种称为核心效果（core effect），一种称为组合效果（combination effect）

顾名思义，core effect提供了一种比较单一的效果，例如元素的渐变隐藏、元素的移动等等，所有的core effect都是继承于Effect.Base 这个基类，Effect.Base类实现了浏览器中用js表现一段动画效果的整个逻辑，而每个具体的core effect类实现该效果的表现代码就可以了

而combination effect把各种不同的core effect组合起来实现了一些比较复杂的动画效果

调用方法：

在header中引用scriptaculous文件：

<script src="lib/prototype.js" type="text/javascript"></script>

<script src="lib/scriptaculous.js" type="text/javascript"></script>

scriptaculous是建立在prototype之上的，所以要先引用prototype，

如果你只想使用scriptaculous中的effect效果库，可以把第二句修改为

<script src="lib/scriptaculous.js?load=effects" type="text/javascript"></script>

这样的话就不会把所有的scriptaculous文件都引入到页面了

第二步：实例化你想要的效果类：

例如： new Effect.Opacity(”testDiv1″,{from:1,to:0}) ,实现元素慢慢隐藏的效果，其中Effect.Opacity 是要实现的效果的名称，也是实现这个效果的类的名称，调用的时候要提供两个参数，其中第一个参数”testDiv1″指定该效果要作用的对象(html元 素)，可以是元素id或者是元素的引用，其中第二个参数 {from:1,to:0} 指定这个效果的具体参数，它是一个javascript对象，{from:1,to:0}在这里是表示不透明度由1变成0，也就是把元素慢慢变成透明了， 持续时间是1秒钟(默认)

其他的效果调用方式跟Effect.Opacity基本一样，提供一个html元素以及一个js对象来指定效果的具体参数
比如 new Effect.Move(”testDiv1″,{x:20,y:30}) ，将id为testDiv1的元素慢慢的向下移动20px，同时向右移动30px

其中第二个参数默认是：
{
duration: 1.0, // 持续时间
fps: 60.0, // 每秒的帧数
sync: false, // 只有在同时播放一些动画效果的时候才需要设置为true，下面会介绍
from: 0.0, // 从哪里开始
to: 1.0, // 到那里结束 //这两个参数下一节会说明
delay: 0.0 // 延迟执行的秒数，可以看成是开始执行的时间
}
除了指定这些参数外，还可以在这个参数中指定动画的事件处理函数，例如afterFinish等
{
from:1,
to:0,
afterFinish:function(){alert(”运行结束了”)}
}

初步认识Effect.Base和core effects

Effect.Base是所有core effects效果类的基类，也是创建我们自己的效果类的基础