完美運動框架(原生js實現)

2021-08-22 02:38:26 字數 721 閱讀 8727

//匯入js檔案,呼叫函式即可用

//這個運動框架,支援多物體多樣式的鏈式運動,和多物體多樣式的同時運動(做的是緩衝運動)

function startmove(obj,json,fn)else

//4、設定緩衝運動速度

speed = (json[attr] - currentvalue) / 8;

//5、處理速度,讓它始終為乙個整數,因為計算機支援的最小畫素為1

speed = speed > 0 ? math.ceil(speed) : math.floor(speed);

//6、改變當前值

currentvalue+=speed;

//7、判斷所有屬性是否達到目的值

if (currentvalue != json[attr])

if (attr == 'opacity') else

} //8、所有屬性的值達到目的值了,關閉定時器

if (isyes)

} },30);

}//獲取外部樣式

function getstyle(obj,stylename)else

}

接下來測試一下這個完美運動框架:

12

34緩衝運動

先變寬,再變高,最後變透明度

變寬變高變透明度同時進行

js完美運動框架

建立move.js運動框架function getstyle obj,name else 任意值的運動框架 var timer null function startmove obj,json,fnend else 計算速度 var speed json attr cur 6 speed speed...

js完美運動框架

完美運動框架js檔案及說明 呼叫說明 node為節點 json為要變化的的屬性組成的物件 例 意思為要 讓node節點物件 寬變化到300px,高變化到200px,不透明度變化到30。complete 為當json物件的各項屬性都變化到位時,需要執行什麼。這裡 傳入函式。一般為匿名函式。也可以在匿名...

JS完美運動框架

function getstyle obj,attr else function startmove obj,json,fn else 2.算速度 var ispeed json attr icur 8 ispeed ispeed 0?math.ceil ispeed math.floor ispe...