如何寫一個通用的JavaScript效果庫！(1/2)
2024-09-06 12:42:40
供稿：網友
JavaScript的動態(tài)效果最基本的是 動態(tài)改變大小，移動位置，改變透明度，改變顏色等等。
而其他一些比較炫的效果無非是對這些最基本效果的組合和運用。
現(xiàn)在網上已經有很多很不錯的優(yōu)秀Javascript庫或者效果庫，我們是否有必要再造輪子呢？
放眼望去，Yahoo UI, 基于Prototype的scriptaculous, Rico， JQuery, Dojo，還有很多很多。
這些庫都帶有很不錯很優(yōu)秀的動態(tài)效果。我們可以直接使用。
但是對于一些中小型項目來說，只是偶爾用到一兩個特效，就沒有必要引用整個框架，要知道
這些家伙體積都不小哦. prototype.js 50K, scripttaculous的 effects.js也有40-50k dojo,yui 更大。
在大多數(shù)情況下我們需要一個小巧獨立(300行代碼以內)，無侵入性的效果庫。.即使有現(xiàn)有的輪子，
我們不但要學會怎么使用輪子，更要學會如何親手造一個輪子。
基于以上原因，我們今天來重寫一個靈活的，擴展性強的，小巧的，跨瀏覽器的動態(tài)效果庫。
考慮到prototype.js 用戶群的廣泛性，我的部分代碼引用了prototype.js,當然，我說過 ，我們要做一個獨立
的效果庫，即使在沒有prototype.js的情況下，也要讓代碼正常工作。
先做一些準備工作。下面這些代碼是任何效果庫中必不可少的，因為它負責一些類似取位置坐標，
設置，獲取element的透明度等這些基礎工作。
代碼：
代碼如下:
/*
這個函數(shù)的代碼來自 Prototype.js http://prototype.conio.net/
如果頁面引用了prototype.js ,則可以刪除下面這個函數(shù),
當然,即使不刪除也沒關系,因為作了簡單的兼容性判斷
*/
(function(){
if (!("Prototype" in window)){
Prototype={emptyFunction:function(){}};
Class ={
create: function(){return function(){this.initialize.apply(this, arguments)}}
};
$ = function(element){
return typeof(element)=="string"?document.getElementById(element):element
};
$A= function(arrLike){
for(var i=0,ret=[];i<arrLike.length;i++) ret[i]=arrLike[i];
