怎样写一个通用的JavaScript效果库！(2/2)

续上回: 怎样写一个通用的JavaScript效果库！(1/2)

在上个随笔中贴出了效果库的整体框架，和一个简单的opacity插件. 今天这个随笔主要是扩展其他常用
效果插件，毕竟框架只能是个空壳，内容还是要自己充实。
如果看过了我上篇的实现细节，这里就不多说废话了，来段代码先：

// 移动， 这里是move to 就是移动到 x,y 当然，大家也可以再扩展一个move by 移动x个象素

// zoom by Go_Rush(阿舜) from http://ashun.cnblogs.com/
// size 同上，是 size to, 改变到指定大小 by Go_Rush(阿舜) from http://ashun.cnblogs.com/
// 背景色 by Go_Rush(阿舜) from http://ashun.cnblogs.com/
// 透明度，这个上个贴过了 by Go_Rush(阿舜) from http://ashun.cnblogs.com/
这里 effect.setting 是非常有用而且非常重要的冬冬，所有的通过options传进来自定义函数都可以
通过effect.setting来获取element最初的设置。 在很多场合，我们需要在 options 中传一个 onComplete
函数进来， 用来在效果执行完毕后，打扫战场，恢复一些设置。
这些效果是可以重叠的，大家可以看看下面我写的例子。

写了十来个例子，应该很详细了。

完整的，可调试代码和例子如下：


<script language="javascript">

Effect =Class.create();
Effect.Fn =new Object();
Effect.Init =new Object();

// 移动， 这里是move to 就是移动到 x,y 当然，大家也可以再扩展一个move by 移动x个象素

// zoom

// size 同上，是 size to, 改变到指定大小

// 背景色

// 透明度，这个上个贴过了

var i=0;

</script>
<fieldset>
<legend>单一效果</legend>
<button onclick="javascript:foo1()">颜 色 foo1</button> 
<button onclick="javascript:foo2()">大 小 foo2</button> 
<button onclick="javascript:foo3()">位 置 foo3</button> 
<button onclick="javascript:foo4()">透 明 度 foo4</button> 
<button onclick="javascript:foo5()">Zoom foo5</button> 
<button onclick="javascript:foo6()">所有 foo6</button> 
<br />
</fieldset>
<br />
<fieldset>
<legend>复合效果</legend>
<button onclick="javascript:fix1()"> 淡出fix1</button> 
<button onclick="javascript:fix2()"> 折起fix2</button> 
<button onclick="javascript:fix3()"> 慢慢变小消失 fix3</button> 
<button onclick="javascript:fix4()"> 慢慢变小消失2 fix4</button> 
<button onclick="javascript:fix5()"> 变色 fix5</button> 
<button onclick="javascript:fix6()"> 震动5次 fix6</button> 
<br />
</fieldset>

<br />
<br />
<button onclick="javascript:location.reload()"> 每次效果后按这里恢复</button> 
<br/>
<br/>
注意 FireFox 不支持 Zoom

<div id="div1" style="border:1px solid red;width:300px;height:150px;overflow:hidden;position:absolute;left:300px;top:200px;z-index:2;background-color:#ffffff">
<a href="http://ashun.cnblogs.com/">Go_Rush(阿舜)</a>
<img src="http://www.google.com/intl/zh-CN_ALL/images/logo.gif"><br />
</div>